Получить значение пунктов в checkboxlist и сохранить в hiddenfield

Question

У меня есть checkboxlist.

<asp:CheckBoxList ID="cblList" runat="server" RepeatDirection="Horizontal">             
<asp:ListItem Value="S04">1</asp:ListItem> 
<asp:ListItem Value="S08">2</asp:ListItem> 
<asp:ListItem Value="S09">3</asp:ListItem> 
<asp:ListItem>All</asp:ListItem> 
</asp:CheckBoxList> 

и скрытое поле

<asp:HiddenField ID="hddnValue" runat="server" /> 

Я хочу, чтобы сохранить выбранное значение CheckBoxList в скрытом.

Сгенерированный HTML

<td><input id="ctl00_ContentPlaceHolder1_cblList_0" type="checkbox" name="ctl00$ContentPlaceHolder1$cblList$0" /><label for="ctl00_ContentPlaceHolder1_cblList_0">1</label></td> 

<td><input id="ctl00_ContentPlaceHolder1_cblList_1" type="checkbox" name="ctl00$ContentPlaceHolder1$cblList$1" /><label for="ctl00_ContentPlaceHolder1_cblList_1">2</label></td> 

<td><input id="ctl00_ContentPlaceHolder1_cblList_2" type="checkbox" name="ctl00$ContentPlaceHolder1$cblList$2" /><label for="ctl00_ContentPlaceHolder1_cblList_2">3</label></td> 

<td><input id="ctl00_ContentPlaceHolder1_cblList_3" type="checkbox" name="ctl00$ContentPlaceHolder1$cblList$3" /><label for="ctl00_ContentPlaceHolder1_cblList_3">4</label></td> 

Я попытался

$(function() { 
    $('#ctl00_ContentPlaceHolder1_btnConfirm').click(function() { 
     debugger; 
     var val = []; 
     $(':checkbox:checked').each(function(i) { 
      val[i] = $(this).val(); 
     }); 
    }); 
}); 

без удачи. Пожалуйста помоги.

Спасибо,

Rahul

Answer 1

Альтернативно Вы можете сделать что-то вроде этого

$('#ctl00_ContentPlaceHolder1_btnConfirm').click(function() { 
    var val = []; 
    $('#cblList').find('input[type=checkbox]:checked').each(function() { 
     val.push($(this).val()); 
    }) 
    $('#hddnValue').val(val.join(',')); 
}); 

Answer 2

Во-первых, добавить class на скрытому поле, чтобы сделать его легче определить:

<asp:HiddenField ID="hddnValue" CssClass="selectedItems" runat="server" /> 

Затем в JQuery использовать map() создать массив выбор и установить значение в листинг, разделенный запятыми:

$('#ctl00_ContentPlaceHolder1_btnConfirm').click(function() { 
    var values = $(':checkbox:checked').map(function() { 
     return this.value; 
    }).join(','); 
    $('.selectedItems').val(values); 
});