Question

We’re generating a dropdownlist in ASP.NET repeater as below –

<asp:DropDownList ID="ddlQty" runat="server">
    <asp:ListItem Text="0" Value="0" Selected="True" />
</asp:DropDownList>

So there are several dropdownlists generated on the page. For all these lists, I am trying to populate items containing values from 1 to 10.

jQuery(document).ready(function () {

    var ddlQty = jQuery("select[id$='ddlQty']");                
    jQuery.each(ddlQty, function () {
        var curDdl = jQuery(this).next();            
        for (i = 1; i <= 10; i++)
            curDdl.append(jQuery('<option>', { value: i, text: i }));
    });
});

This code doesn’t work, Can you please help.

Thank You !

EDIT:

Thank you for all your respones, the issue lied in, generating ID of repeaters, repeaters controls ID were replaced by ***ddlQty_0, so I must use contains wild card in jQuery.

Fixed Code.

jQuery(document).ready(function () {

var ddlQty = jQuery("select[id*='ddlQty']");

jQuery.each(ddlQty, function () {
    var curDdl = jQuery(this);
    for (i = 1; i <= 10; i++)
        curDdl.append(jQuery('<option>', { value: i, text: i }));
});

});

Answer 1

Try replacing:

var curDdl = jQuery(this).next();

with:

var curDdl = jQuery(this);

You don’t need to be working on the next element in the DOM but with the current element which is the dropdown.

Also your code could be simplified a bit:

jQuery(document).ready(function () {

    jQuery('select[id$="ddlQty"]').each(function() {
        var curDdl = jQuery(this);
        for (i = 1; i <= 10; i++) {
            curDdl.append(jQuery('<option>', { value: i, text: i }));
        }
    });
});