Does there exist a way to store two separate values in a select form element? For instance
<select>
<option value="">A + B</option>
</select>
I would like to store values A and B separately, but select them both with one option.
You can add two options:
<option value="a">A</option>
<option value="b">B</option>
Is this what you need?
Use a multiple select instead:
<select name="yourChoices[ ]" multiple>
<option value="A">A</option>
<option value="B">B</option>
</select>
Users are able to choose more than one option.
Here is an example: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select_multiple
Related
I'm having some weird issues.
I need a multiple select with some values in it, but somehow if I type
multiple and size values to select tag they are not working.
For that I decided to make a new clear file to test it and the result is same.
<form action="" method="post">
<select name="data[]" multiple size="5">
<option value="1">1Value</option>
<option value="2">2Value</option>
<option value="3">3Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
</select>
</form>
These are my codes, and this is below is the result:
screenshot
I can't even select them one by one, I mean browser is not highlighting the ones that I selected, I need to hold CTRL to hightlight them, as like working on windows I don't know where is the problem.
Most likely you have installed some Chrome extension that is preventing the Ctrl key to work as expected. Try removing that.
Have you bind it inside select tags?, you have to.
<select name="values" multiple>
<option value="1">value1</option>
<option value="2">value2</option>
<option value="3">value3</option>
<option value="4">value4</option>
</select>
Hope it helps.
Please go with HTML multiple Attribute.
Try Below code:
<select name="Custom_Name" multiple>
<option value="1">1Value</option>
<option value="2">2Value</option>
<option value="3">3Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
<option value="4">4Value</option>
Al the best.
I have a select like this :
<select name="cars" multiple>
<option value="volvo" selected>Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
I would like the option "Volvo" selected by default and required, but the user can unselect it if he wants. I would like that the user would not be able to unselect it.
This select is generated with PHP, so I can add an hidden field, but I want the user to know that this option is required. How can I do that?
I notice that if you add multiple to a select element then all of the options are shown, while without multiple the element has a drop down button. I would like to have the drop down button and then be able to select multiple items from the drop down list. Is this possible?
There's a jsfiddle here: http://jsfiddle.net/Z6KWr/3/
<select id="delete_dropdown" multiple>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
</select>
Thanks
No, the dropdown cannot allow multiple selection. For doing so you have to use some other plugin which will allow multiple selection while looking like a dropdown.
There are some plugins which you can find here
https://code.google.com/p/dropdown-check-list/
http://www.erichynds.com/blog/jquery-ui-multiselect-widget
http://blogs.prakashinfotech.com/multi-select-dropdown-list-using-jquery-plug-in-chosen.html
This is not possible in HTML. If you're interest in jQuery plugins then check
Multiple Select in Chosen.js
or
Multi-Value Select Boxes in Select2.js
I'm trying to populate a searchable dropdown list with specific values, but I would like to combine two of the values and have them return results for either value. For example:
<td align="left" valign="top" nowrap>
<select name="SPORTS"
id="idCustom1"
onChange="AddSearchItem(this);"
class="StuFindSelect">
<option value=" ">No Attribute selected
<option value="BASEBALL">Baseball
<option value="BASKETBM">Mens Basketball
<option value="BASKETBW">Womens Basketball
<option value="CHEERLDS">Cheerleader
<option value="FOOTBALL">Football
<option value="GOLF">Golf
<option value="LACROSSW">Womens Lacrosse
<option value="SOCCERM">Mens Soccer
<option value="SOCCERW">Womens Soccer
<option value="TENNISM">Mens Tennis
<option value="TENNISW">Womens Tennis
<option value="TRACK">Track
<option value="VOLLEYBL">Volleyball
<option value="XCOUNTM">Mens Cross Country
<option value="XCOUNTW">Womens Cross Country
</select>
</td>
I want to combine the results that return BASKETBM or BASKETBW when a user selects Basketball. After researching I've tried combining them in several different ways,
<option value="[BASKETBM,BASKETBW]">Basketball
<option value="BASKETBM,BASKETBW">Basketball
<option value="BASKETBM|BASKETBW">Basketball
and every other permutation I could find, but nothing seems to work. Everytime it returns zero search results when testing it. Any ideas what I'm doing wrong?
Thanks.
I do not know what AddSearchItem(this); does, as a function, but I'm guessing the problem is there. Maybe you can detail more this part of your question.
You can without problem have an option like this:
<option value="BASKETBM,BASKETBW">Basketball
and use this.value.split(',') to get values out of it.
below is the select html code and I'm looking for the first option which is 15
<select>
<option value="15" selected="selected">15</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
I have tried this below and I get all the selection 15,25,50,100
div#topPager.gridHeader div.pagerItemContainer select.pagesize option
if I use the nth of type like this then I got the first selection.
div#topPager.gridHeader div.pagerItemContainer select.pagesize option:nth-of-type(1)
is there any other way of doing instead of using the nth-of-type?
More to the point and accurate:
#yourSpecificSelectors option[value="15"] {}
This is called an attribute selector, in this case it matches the option with value="15".
http://www.w3.org/TR/CSS2/selector.html#attribute-selectors