Question

I have a form which has a select list associated with the field players.

To populate the listbox, user clicks on a button on the form to display a popup and from that popup select players’ names and then click another button on the popup which closes the popup and displays the selected values in the listbox.

By default, i put selected="true" in the select tag so that when user saves the form, the values in the listbox are saved.

<select size=5 id="sub_player_ids" name="sub[player_ids][]"  multiple selected="true">

The above code selects all options in the selectbox and those options are highlighted in blue.

However it can happen that user deselects an option in the player’s select box by error.

I would like all options in the select box to be selected by default – whether they are highlighted or not

Is there is a way to select all options in the select box by default when saving the form?

Thanks a lot for any suggestion provided.

Cheers

Answer 1

Do you know the values in the select? You can loop over the select and set each options selected to true.

for (var i = 0, children = select.childNodes, l = children.length; i < l; i++) {
    if (children[i].tagName === "OPTION") children[i].selected = true;
}

Fiddle is using the fact that Chrome/IE7+ should define window.select as the element found in the DOM by the ID select. If you run this in Firefox you’ll need var select = document.getElementById('select');

http://jsfiddle.net/robert/VKF4E/