I need a help
I'm using simple form for select box. The code is here: = f.input :dogs, collection: (0..7). When render on browser, it will display select box with value from 0 to 7. I want add text behind value when select box dropdown. Eg: 1 dog - 2 dogs. I tried but not work.
Pls help me
You can use something like the following:
= f.input :dogs, options_for_select([["1 dog", 1], ["2 dogs", 1]])
= f.input :dogs, options_for_select((1..8).map{|x| x==1? ["#{x} dog",x] : ["#{x} dogs",x] })
A really simple and elegant solution could be something like this:
Create a helper method:
def humanize_dogs
0.upto(7).each_with_object({}) { |c, h| h[pluralize(c, 'dog')] = c }
end
# => {"0 dogs"=>0, "1 dog"=>1, "2 dogs"=>2, "3 dogs"=>3, "4 dogs"=>4, "5 dogs"=>5, "6 dogs"=>6, "7 dogs"=>7}
In your form add the next line:
= f.input :dogs, collection: humanize_dogs
This generates...
<select id="#" name="#">
<option value=""></option>
<option value="0">0 dogs</option>
<option value="1">1 dog</option>
<option value="2">2 dogs</option>
<option value="3">3 dogs</option>
<option value="4">4 dogs</option>
<option value="5">5 dogs</option>
<option value="6">6 dogs</option>
<option value="7">7 dogs</option>
</select>
Related
I want to get country group name when select option. I've countries with several group like
<template>
<select id="countries" v-model="country" #change="getCountryGroup($event)">
<optgroup label="Asia">
<option value="AF">Afghanistan</option>
<option value="AM">Armenia</option>
<option value="AZ">Azerbaijan</option>
...
<option value="BD">Bangaldesh</option>
...
</optgroup>
<optgroup label="Australia / Oceania">
<option value="AS">American Samoa</option>
<option value="AU">Australia</option>
<option value="CK">Cook Islands</option>
</optgroup>
<optgroup label="Africa">
<option value="DZ">Algeria</option>
<option value="AM">Angola</option>
<option value="AZ">Azerbaijan</option>
</optgroup>
<optgroup label="South America">
<option value="AR">Argentina</option>
<option value="BO">Bolivia</option>
<option value="BR">Brazil</option>
</optgroup>
<optgroup label="North America">
<option value="US">United States</option>
<option value="UM">United States Minor Outlying Islands</option>
<option value="CA">Canada</option>
</optgroup>
<optgroup label="Europe">
<option value="UK">United Kingdom</option>
<option value="AL">Albania</option>
<option value="AD">Andorra</option>
</optgroup>
</select>
</template>
Suppose when I select Bangladesh then I want to get optgroup name Asia. Here is my vueJs method
getCountryGroup: function(event){
console.log( event.target.getAttribute('label') );
}
Here are two steps
Get the selected index
Find the selected option
Select the parent element (optgroup) for the selected option
Finally, get the label (Country group)
getCountryGroup: function(event){
// 1. Get the selected index
const index = event.target.selectedIndex;
// 2. Find the selected option
const option = event.target.options[index];
// 3. Select the parent element (optgroup) for the selected option
const optgroup = option.parentElement;
// 4. Finally, get the label (Country group)
const countryGroup = optgroup.getAttribute('label');
console.log(countryGroup);
}
Here is the demo https://codepen.io/maab16/pen/KKKpJba
I am using materilizecss and i have the following dropdown:
<select class="txtInput" data-val="true" data-val-number="The field SelectedAssetCategoryId must be a number." data-val-required="Select a asset category" id="ddlAssetCategory" name="SelectedAssetCategoryId"><option value="">Asset Category</option>
<option value="1">Disease State/Condition Training</option>
<option value="5">Hot Topics Training</option>
<option value="6">Launch Training</option>
<option value="7">Medical Meetings</option>
<option value="2">Product Training</option>
<option value="8">Quiz</option>
<option value="4">Real World Evidence/HEOR Training</option>
<option value="3">Treatment/Competitive Landscape Training</option>
</select>
I was initilizing it like so:
$("select").not('[multiple="multiple"]').formSelect({
});
But what i wanted was the dropdown to show below the selectbox not above , so i added the below line of code:
$("select").not('[multiple="multiple"]').formSelect({
belowOrigin: true
});
But even this does't seem to work , What option can i add so that the dropdown menu shows below the select box ?
Use This :
$("select").not('[multiple="multiple"]').formSelect({
dropdownOptions: {coverTrigger: false}
});
Instead of :
$("select").not('[multiple="multiple"]').formSelect({
belowOrigin: true
});
JSFiddle
Actually with dropdownOptions you can pass dropdown options to select form.
I need make an option list with optgroup from the results of a query like this:
<select>
<optgroup label="here one of the results of query">
<option>rest of results</option>
</optgroup>
</select>
I need something like this (or better). Example in php:
<?php
$sql= "query here";
$result=$connection->createCommand($sql)->queryAll(); //to execute the query and save in the variable result
for ($i=1; $i <count($result) ; $i++)
{
$a = $i-1
if ($result[$a]["optiongroup"] == $result[$i]["optiongroup"])
{
// agree to the optiongroup with an option
}
else
{
// close the optiongroup and starts a new option group
}
}
?>
I have this:
Controller:
#componentes = Tipo.find_by_sql("SELECT t1.tip_titulo as pieza, t2.tip_id, t2.tip_titulo FROM `tipos` t1
LEFT JOIN tipos t2 ON (t1.tip_id = t2.tip_id_padre)
WHERE t1.tip_id_padre IN (38)")
In the query the results show like this:
pieza tip_id tip_titulo
Fuente de poder 41 Ventilador
Fuente de poder 42 Conector de alimentacion
Memoria Ram 43 Placa
Memoria Ram 44 Reloj
So the select must appear in this way:
<select>
<optgroup label="Fuente de poder">
<option value="41">Ventilador</option>
<option value="42">Conector de alimentacion</option>
</optgroup>
<optgroup label="Memoria RAM">
<option value="43">Placa</option>
<option value="44">Reloj</option>
</optgroup>
</select>
How do I solve this with Rails 5.0.1?
greetings.
In a regular rails app you should define a view template(that should have the name of your controller with html.erb ending, for example products.html.erb)
Then you define in products.html.erb:
<select>
<optgroup label="here one of the results of query">
<% #components.each do |component| %>
<option value='<%= component.tip_id %>'> <%= component.tip_titulo %></option>
<%end%>
</select>
So as you will see that the #componenets you defined in the controller is autometically accessible in your template view.
See the docs for Rails select http://apidock.com/rails/ActionView/Helpers/FormOptionsHelper/select
I have exactly that #Joel_Blum, look:
<select class="form-control" name="tip_id_componente[]" id="tip_id_componente" multiple="multiple" size="8" style="color: black; width: 400px; ">
<% #componentes.each do |c| %>
<option id="<%= c.tip_id %>" value="<%= c.tip_id %>"><%= c.tip_titulo %> (<%= c.pieza %>)</option>
<% end %>
</select>
but it appears without the optgroup, if i agree the optgroup like this:
<select class="form-control" name="tip_id_componente[]" id="tip_id_componente" multiple="multiple" size="8" style="color: black; width: 400px; ">
<% #componentes.each do |c| %>
<optgroup label="<%=c.pieza%>">
<option id="<%= c.tip_id %>" value="<%= c.tip_id %>"><%= c.tip_titulo %> (<%= c.pieza %>)</option>
</optgroup>
<% end %>
Then show the html code like this:
<select>
<optgroup label="Fuente de poder">
<option value="41">Ventilador</option>
</optgroup>
<optgroup label="Fuente de poder">
<option value="42">COnector de alimentacion</option>
</optgroup>
<optgroup label="Memoria ram">
<option value="43">placa</option>
</optgroup>
<optgroup label="Memoria ram">
<option value="44">reloj</option>
</optgroup>
<select multiple>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
How in Haml can I create a select multiple tag like in HTML? Like the nice helper function of select_tag.
Just do this
%select{:multiple => true}
%option{value: 'volvo} Volvo
%option{value: 'saab'} Saab
%option(value: 'opel'} Opel
%option{value: 'audi'} Audi
You can obviously also use select_tag:
= select_tag
EDIT
An even cleaner way to do the above:
%select{:multiple => true}
- ["Volvo", "Saab", "Opel", "Audi"].each do |o|
%option{value: o.downcase} o
I have a html select syntax like :
<select id="salary_structure_salary_structure_line_items_attributes_0_payhead_id" class="half" name="salary_structure[salary_structure_line_items_attributes][0][payhead_id]">
<option data-payhead="Earnings" value="2"> Basic </option>
<option data-payhead="Earnings" value="3"> Daily allowance </option>
<option data-payhead="Standard deductions" value="4"> Employee provident fund </option>
</select>
How do i get this work in rails syntax? what change should i do in below code to get the above result:
<%= select_tag "salary_structure[salary_structure_line_items_attributes][#{index}][payhead_id]", options_from_collection_for_select(#payheads, :id, :payhead_name, :selected => salary_structure_line_item.payhead_id ), :include_blank => true, :class => "half"%>
also i want to use 'selected' option in this code.
Hey I think this is rather complicated using the options from collection for select
See: http://www.redguava.com.au/2011/03/rails-3-select-list-items-with-custom-attributes/
options_array = [
["Basic", 2, "data-payhead" => "Earnings"],
["Daily allowance", 3, "data-payhead" => "Earnings"],
["Standard deductions", 4, "data-payhead" => "Standard deductions"]
]
select_tag("salary_structure[salary_structure_line_items_attributes][0][payhead_id]", options_for_select(options_array, value), :class => "half")
In the above code, in the options_for_select method please specify the value with the select box option's value. this will embed the selected attribute for that option