How to set value of drop-down-menu with JavaScript?

[Daniel1111]

Hi,

I got a drop-down-menu with dynamically parameters. I have set a specific value in my JavaScript and I would like to change the shown value in the drop-down-menu to the value of my JavaScript when first open the html-file.

So I do not want to make a new entry in my drop-down-menu as all needed entries are already available due to the dynamic drop-down-menu.

What I wanna do is to compare my desired value in my JavaScript with the values of my drop-down-menu and if there is something identical then change the value of the drow-down-menu to that desired value.

What I don't understand to solve that problem is:
1. How can I read all the entries of a drop-down-menu and compare it with my value in JavaScript?
2. How can I select one specific entry when I open the html-file?

[gits]

what have you tried so far? here are the ideas behind it:

1: get a reference to the select-element that you want to test with and loop over the options to find out a match

2: get a reference to the select-element where you want to set the value and set the selected attribute or use a setter for the value that the element provides

[Daniel1111]

So what I have in my xslt:

<th rowspan="2">plane
                <select id="modelRangeDropdown" onclick="JavaScript_Filter(this)">
                        <option selected="selected">All</option>
                        <xsl:for-each select="logstore/plane">
                        <option>
                            <xsl:value-of select="Name" />
                          </option>
                     </xsl:for-each>                    
                </select>                    
            </th>    
 

And what I was trying to do was something like:

document.getElementById("modelRangeDropdown")[0].text;
... // But how to loop over the options?
 

[gits]

looping could look like this:

var mySelectNode = document.getElementById("mySelect");
 
for (var i = 0, l = mySelectNode.options.length; i < l; i++) {
 
    var opt = mySelectNode[i];
    console.log(opt.text);
}

[Daniel1111]

Thanks for you answer. That's great. Does there exist a function for selecting an entry of a drop-down-menu for JavaScript like selecting it with a computer mouse?

[Daniel1111]

I have found the solution:
Just use:

document.getElementById("modelRangeDropdown").selectedIndex = row_number_of_dropdown_value;