JavaScript实现GridView单列Checkbox全选功能

GridView单列Checkbox全选实现

在 GridView 控件中包含多个 Checkbox 时，通常需要实现全选或全不选功能。网络上常见的参考代码往往会导致全选 GridView 中所有的 Checkbox，但实际需求可能是仅对某一列进行全选操作。如图所示：。审核和权限功能需要分开处理。为此，我编写了以下 JavaScript 代码，供参考使用。

 
function chkAll(CheckAll) {
var items = document.getElementsByTagName("input");
for (var i = 0; i < items.length; i++) {
if (items[i].type == "checkbox"){
for (var j = 2; j < 10; j++) {
var id = "ctl00_ContentPlaceHolder1_GridView1_ctl0" + j + "_CheckBox1";
if (items[i].id == id) {
items[i].checked = CheckAll.checked;
} 
} 
} 
} 
} 

其中，第5行的 j 和第6行的 id 用于确定同一列的 Checkbox。具体的 j 范围以及 id 格式可能因环境而异，可以通过 alert(items[i].id); 遍历整个 items 数组来查看相应的 id。

前台相应的代码如下：

 
<asp:TemplateField HeaderText="审核">
<HeaderTemplate>
<asp:CheckBox ID="chkAll" onclick='chkAll(this)' runat="server" />
审核
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" Checked='<%# Eval("isCheck") %>' runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" Width="100px" />
</asp:TemplateField>