How To Set Asp.net Dropdownlist Index To 0 From The Front-end

I have the following code in ASP.net page:

Solution 1:

There are many ways to do this but here is the solution with JavaScript:

functionsetSelectedIndex(dropdownlist, selVal)
    var ddl1 = document.getElementById(dropdownlist);
    //alert(ddl1.selectedIndex); //displays the proper index...if(ddl1.length >= selVal)
    {
       ddl1.selectedIndex = selVal;
    }
}

Call the above function as per you required as below:

setSelectedIndex('<%=ddl1.ClientID %>', 2);

UPDATE As you said you have already set ClientIDMode, try the following updated function:

functionsetSelectedIndex(selVal){
    var ddl1 = document.getElementById('ddl1');
    if(ddl1.length >= selVal)
    {
       ddl1.selectedIndex = selVal;
    }
}

and call it as:

setSelectedIndex(0);

Solution 2:

I was using the Chosen Jquery which caused the dropdownlist to not update.

This is the HTML:

<select name="ctl00$BodyPlaceHolder$ddl1" id="ddl1"class="chose-select le">
    <option value="Select a State">Select a State</option>
    <option value="Alabama">AL</option>
    <option value="Alaska">AK</option>
    <option value="Arizona">AZ</option>
</select>

JavaScript which sets the selected index to 0:

functionsetSelectedIndex(dropdownlist, selVal) {
    var ddl1 = document.getElementById(dropdownlist);
    if (selVal < ddl1.selectedIndex) {
        ddl1.selectedIndex = selVal;

        $(ddl1).val(0).trigger('chosen:updated');
    }
}

That does the trick.

Share