Develop Reference

php drop downlist with 2 values the 2nd value post to hidden field

I've got a regular drop downlist for selecting the countries name as text and countries_id as value.
Example:
<option value="1">Afghanistan</option>
Now I need an hidden form field with the ISO2 code for the country.
Example:
<input type="hidden" name="iso2" id="inputIso2" class="form-control">
And when the country is changed by the drop downlist, the hidden field should also change.
I've added the ISO2 to the option like this:
<option value="1" data-iso2="AF">Afghanistan</option>
But how do I pass it to the hidden field?
Or is there a better way of doing this?
The ISO2 field is being used by another script in the form, so it should work pre post.

This isn't really a PHP problem so much as it is a javascript problem. You need to put an event listener on your select element and when it changes, grab data-iso2 and apply the value to the hidden field.
Using jQuery, you'd do this:
$("#country").change(function(){
var iso2 = $(this).find(':selected').data('iso2');
$("#inputIso2").val(iso2);
});

PHP Multiselect values postback

I have two multiselect boxes and the user can move items from one box to other (accomplished using Javascript). However, when I post the form, the POST value for the multiselect box where the user moves items to is empty. If I select a few of them and then postback, I can see the ones I selected.
My question is....can I get all the values in a particular select box regardless of whether or not they're selected?
<select multiple="multiple" class="form-control" id="viewSelected" name="viewSelected[]">
//options go here
</select>
Thank you!
Jason

I think you are asking about dependable dropdown list. Am i right?

To get option values and text you can loop through them
$('select option').each(function(){
let value = $(this).attr('value');
let text = $(this).text();
});

To print according to the value of first box, you need to give a class to the first box. Every time after clicking the box a unique id will be generated.
According to that, you can get data in the second box by using Ajax function

Finding selected value in a select box

I'm making a quiz application involving a select box. The user selects an option and when they press a button, it should check if the selected option is the correct answer by checking an array of values. I can't figure out how to get the selected value from the select box. I've tried to find information about this, but I only want to use JS, no JQuery. I tried using:
var item = document.getElementById("selections");
var selection = item.options[item.selectedIndex].value;
but I get a Type Error, saying that item.selectedIndex isn't defined. I'm confused because from what I found, selectedIndex is a default property of select tags? I've only worked with radio buttons before, using a for loop and checking every option to see which was checked, but I can't use that here. I don't know if it matters, but I'm doing this without a form tag, just linking a js function to an event listener on a button. Any help would be appreciated. Thanks!
Edit: Here is a fiddle of my code as per request: https://jsfiddle.net/jmf68ycu/
The part where the problem lies is in the submit() function in the first line.
Update: I found something online about the problem having to do with JS trying to call the element before the element is loaded, so I put the variables inside the function, which is only called when the button is pressed. The problem still persists (same error).

You use like this
var item = document.getElementById("selections").value;
you select value store item variable
this code use full for you. :)

You have a syntax error somewhere. your code looks right. you probably aren't getting the right id. your first line probably doesn't return the right select.
var e = document.getElementById("bla");
var str = e.options[e.selectedIndex].value;
alert(str);
<select id="bla">
<option value="val1">test1</option>
<option value="val2" selected="selected">test2</option>
<option value="val3">test3</option>
</select>

show empty value in html select element

I have an HTML select element (combo box) in a form with a couple if options in it. As always each option has a specific value. During the page's initialization I get a value from the server that I must use as the selected option in the list. Sometimes however I get a value from the server that does not match any of the available options. (grrrr)
I want to let the user know that the value I got from the server is not a valid option. What I'd like to do is show an empty select box (as if no selection was made) without having an actual empty option as one of the options. Also I'd like to use the default select element if possible. Is something like this possible?
Edit: When you set the value for a combox to '' in IE9 (I used $('select').val('') ) it empties the text in the combo box which is exactly what I need. Unfortunately only IE9 does this, so this is not an option.

Out of the box, HTML selects do not provide such functionality. You will have to add an empty <option value="somethingwrong">Please, pick a value</option> element and use scripting to check if the user has selected this specific value. I'd suggest catching both onchange event of the dropdown and onsubmit event of whole form.

You can insert option in select, and remove that whenever it is changed to reduce problems with that options
Check the Demo here

javascript code to perform validation on select option?

I need some javascript code to validate a select option. Means something like this.
Select Country : --select--
If the user submits the form without selecting country. we have to make a alert him saying
"please select the country".
Let me know how to do this and any sample code appreciatable
Thanks in Advance,
Laxman Chowdary

By keeping
value=""
of the property you can validate it..

try onClick event of jQuery, and just add an alert first for you to see how it works whenever that dropdown is being clicked.