Question

5

how to set the items selected in a listbox with values provided by an array?

rated 0 times [ 12] [ 7] / answers: 1 / hits: 24725 / 13 Years ago, fri, october 14, 2011, 12:00:00

In my apsx page, I have a listbox (techGroups) that has some items that are preselected. The user can change the selections. Meanwhile, I have a reset button. When the user click the reset button, the listbox will be restored with those preselected items selected, while others are not.

I write following javascript function for the reset button's onclientclick. Somehow, after i click the reset button, only the first preselected item get selected, all other preselected items are not.

reset()

{

       var selectedGroups = hiddenfield1.value.split(,); //i saved those preselected items in a hiddenfield

        for (var i = 0; i < techGroups.options.length; i++) {

            for (var j = 0; j < selectedGroups.length; j++) {

                if (techGroups.options[i].value == selectedGroups[j]) {

                    techGroups.options[i].selected = true;

                }

            }

        }

}

Can anybody help me to look at my code and tell me what is wrong? Thanks.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

elishaannac

Add To Favorites

Follow

Total Points: 28

Total Questions: 97

Total Answers: 101

Location: Samoa

Member since Mon, Nov 8, 2021

3 Years ago

elishaannac questions

1 Getting warning in 'eslint-plugin-react-settings' while running eslint

Fri, Mar 11, 22, 00:00, 2 Years ago

1 React-router-dom (v6) with Framer Motion (v4)

Sun, Dec 5, 21, 00:00, 3 Years ago

1 can I display custom javascript in streamlit web app

Mon, Jun 14, 21, 00:00, 3 Years ago

1 Handling state with multiple checkboxes in React Native

Mon, Jul 22, 19, 00:00, 5 Years ago

1 How to add custom row on the end of the table (b-table)

Mon, Jul 8, 19, 00:00, 5 Years ago

View All

answered 13 Years ago naomim · Accepted Answer

May be reference issue (DOM). Try this,

JavaScript:

<script type=text/javascript>

window.onload = function () {

    var btnReset = document.getElementById(btnReset);

    btnReset.onclick = function () {

        var hid1 = document.getElementById(hiddenField1);

        var techGroups = document.getElementById(techGroups);



        var selectedGroups = hid1.value.split(,); //i saved those preselected items in a hiddenfield



        for (var i = 0; i < techGroups.options.length; i++) {

            for (var j = 0; j < selectedGroups.length; j++) {

                if (techGroups.options[i].value == selectedGroups[j]) {

                    techGroups.options[i].selected = true;

                }

            }

        }

    };

};

</script>

Markup:

<form id=form1 runat=server>

<div>

    <input type=hidden id=hiddenField1 value=aa,bb,cc />

    <select id=techGroups size=4 multiple=multiple>

        <option value=rr>rr</option>

        <option value=aa>aa</option>

        <option value=cc>cc</option>

        <option value=zz>zz</option>

        <option value=bb>bb</option>

        <option value=dd>dd</option>

    </select>

    <input type=button id=btnReset value=Reset />

</div>

</form>