ASP.NET JavaScript获取GridView列表数据

项目诉求需要在GridView上添加多选框，然后弹窗一个新界面，进行操作。

GridView添加多选框

在GridView的Column中添加TemplateField

然后再这个标签里面添加多选框（全选）

<%-- 全选或取消 --%>
<asp:TemplateField>
	<HeaderTemplate>
        <center>
            <input type="checkbox" name="chkall" id="chkall" title="全选或取消" onclick="CheckAll(this.form)"
                style="width: 16; height=16" />
         </center>
	</HeaderTemplate>
	<ItemTemplate>
    <center>
        <asp:CheckBox ID="chk" runat="server" CssClass="mybox"></asp:CheckBox>
    </center>
	</ItemTemplate>
	<HeaderStyle Width="30px"></HeaderStyle>
	<ItemStyle Width="30px" Height="18px" />
</asp:TemplateField>

添加之后，需要获取用户勾选之后的数据进行处理。

cs获取多选框值

已批量删除为例子：

<asp:Button CssClass="mybutton" ID="BatBtn" runat="server" Text="批量删除" OnClick="bat_Click"
 Visible="false" OnClientClick="return confirm('确认要删除勾选的数据吗？')" Enabled="true" />

如需获取其他列数据 GridView.Rows[i].Cells[1] 参考这个调试查看

for (int i = 0; i <= GridView.Rows.Count - 1; i++)
{
    CheckBox cb = (CheckBox)GridView.Rows[i].Cells[1].FindControl("id"); 
    if (cb.Checked == true)
    {
     	//获取用户勾选数据 asp:GridView 上设置 DataKeyNames="id"
		GridView.DataKeys[i].Value.ToString();
    }
}

JavaScript获取多选框值

添加批量修改按钮

<input type="button" CssClass="mybutton" name="BatchChkBtn" value="批量修改" ccesskey="a"  
id="BatchChkBtn" runat="server" onclick="javascript:batChk('GridView','batch/xxx_BatChk.aspx');" />

添加js方法

function batChk(grid, url) {
    //获取列表数据
    var gridview = document.getElementById(grid);
    if (gridview) {
        var ids = '';
        var rows = gridview.rows;
        var chkInput = gridview.getElementsByTagName("input");
        for (var i = 0; i < chkInput.length; i++) {
            if (chkInput[i].id.indexOf(grid) > -1 && chkInput[i].type == 'checkbox' && chkInput[i].checked == true) {
                //获取ID传参
                var id = rows[i].cells[1].innerHTML;  //此方法无法获取隐藏列数据
                if (id && null!=id) {
                    ids = id + ',' + ids;
                }
            }
        }
        //先勾选在批量验收
        if (null==ids) {
            alert("请勾选需要批量修改的数据？");
            return false;
        }
     
        //跳转界面
        jumpUrl(url + "?id="+ids);
    }
}
//弹出增加窗口，禁止滚动条的
function jumpUrl(V){
	window.open (V,'newwindow6','height=650,width=1200,top='+(screen.height-550)/2+',left='+(screen.width-750)/2+',toolbar=no,menubar=no,scrollbars=yes,resizable=yes,location=no,status=no') 
}

最后需要把id列设置为显示，通过css隐藏： .idHide { display:none;}

<asp:BoundField DataField="id" HeaderText="id">
	<FooterStyle CssClass="idHide" />
	<HeaderStyle CssClass="idHide" />
	<ItemStyle CssClass="idHide" />
</asp:BoundField>

对于NET网上开发所碰到的问题相关的技术文档确实很欠缺啊，希望本文对你有所帮助。