.net开发中批量删除记录时实现全选功能的具体方法

前端技术 2023/09/04 .NET

1 . JS实现全选

往页面上拖一个GridView,设置好数据源,并为GridView添加一个模板列,往模板列里添加一个chekcbox,比如下面的代码

复制代码 代码如下:

<asp:GridView ID=\"GridView1\" runat=\"server\" AutoGenerateColumns=\"False\" DataKeyNames=\"ProductID\"
    DataSourceID=\"SqlDataSource1\">
    <Columns>
        <asp:BoundField DataField=\"ProductID\" HeaderText=\"ProductID\" InsertVisible=\"False\"
            ReadOnly=\"True\" SortExpression=\"ProductID\" />
        <asp:BoundField DataField=\"ProductName\" HeaderText=\"ProductName\" SortExpression=\"ProductName\" />
        <asp:BoundField DataField=\"SupplierID\" HeaderText=\"SupplierID\" SortExpression=\"SupplierID\" />
        <asp:BoundField DataField=\"CategoryID\" HeaderText=\"CategoryID\" SortExpression=\"CategoryID\" />
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID=\"chk_Del\" runat=\"server\" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

//接下来往页面上添加一个checkbox控件

<asp:CheckBox ID=\"chk_JS\" runat=\"server\" Text=\"全选(JS)\" onclick=\"selectAll(this)\"/>
//并为该控件编写JS脚本如下:
<script type=\"text/javascript\">

    //根据传入的checkbox的选中状态设置所有checkbox的选中状态
    function selectAll(obj)
    {
        var allInput = document.getElementsByTagName(\"input\");
        //alert(allInput.length);
        var loopTime = allInput.length;
        for(i = 0;i < loopTime;i++)
        {
            //alert(allInput[i].type);
            if(allInput[i].type == \"checkbox\")
            {
                allInput[i].checked = obj.checked;
            }
        }
    }
</script>
//基本效果就有了,接下来我们在点缀一下。在网页中添加一个button
<asp:Button ID=\"btn_DeleteRecords\" runat=\"server\" OnClientClick=\"return judgeSelect();\" Text=\"删除选中记录\" />
//添加JS脚本
//判断是否选中记录,用户确认删除
function judgeSelect()
{
    var result = false;
    var allInput = document.getElementsByTagName(\"input\");
    var loopTime = allInput.length;
    for(i = 0;i < loopTime;i++)
    {
        if(allInput[i].checked)
        {
            result = true;
            break;
        }
    }
    if(!result)
    {
        alert(\"请先选则要删除的记录!\");
        return result;
    }
    result = confirm(\"你确认要删除选定的记录吗?\");
    return result;
}

本文地址:https://www.stayed.cn/item/9979

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。