JS全选，复选框是.net服务器控件checkBox 在GridView中的模板列

最新推荐文章于 2020-05-02 12:23:34 发布

Xw_Andy

最新推荐文章于 2020-05-02 12:23:34 发布

阅读量1.5k

点赞数

分类专栏： HTML/DHTML C# javaScript 文章标签：服务器 .net server asp function xhtml

本文链接：https://blog.youkuaiyun.com/xw_andy/article/details/4730979

版权

C# 同时被 3 个专栏收录

16 篇文章

订阅专栏

javaScript

11 篇文章

订阅专栏

HTML/DHTML

5 篇文章

订阅专栏

<%@   Page   Language= "C# "   %>

<%@   Import   Namespace= "System.Data "   %>

<%--http://community.youkuaiyun.com/Expert/TopicView3.asp?id=5714048--%>

<!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Transitional//EN "   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">


<script   runat= "server ">

        protected   void   Page_Load(object   sender,   EventArgs   e)

        {

                if   (!IsPostBack)   {

                        LoadProductData();

                }

        }



        void   LoadProductData()

        {

                DataTable   dt   =   CreateSampleProductData();

                GridView1.DataSource   =   dt;

                GridView1.DataBind();

        }

        #region   sample   data

        static   DataTable   CreateSampleProductData()

        {

                DataTable   tbl   =   new   DataTable( "Products ");

                tbl.Columns.Add( "ProductID ",   typeof(int));

                tbl.Columns.Add( "ProductName ",   typeof(string));

                tbl.Columns.Add( "UnitPrice ",   typeof(decimal));

                tbl.Columns.Add( "CategoryID ",   typeof(int));

                tbl.Rows.Add(1,   "Chai ",   18,   1);

                tbl.Rows.Add(2,   "Chang ",   19,   1);

                tbl.Rows.Add(3,   "Aniseed   Syrup ",   10,   2);

                tbl.Rows.Add(4,   "Chef   Anton 's   Cajun   Seasoning ",   22,   2);

                tbl.Rows.Add(5,   "Chef   Anton 's   Gumbo   Mix ",   21.35,   2);

                tbl.Rows.Add(47,   "Zaanse   koeken ",   9.5,   3);

                tbl.Rows.Add(48,   "Chocolade ",   12.75,   3);

                tbl.Rows.Add(49,   "Maxilaku ",   20,   3);

                return   tbl;

        }

        #endregion

</script>

<html   xmlns= "http://www.w3.org/1999/xhtml "   >

<head   runat= "server ">

        <title> 优快云_GridViewAllAndRowCheckBox </title>

        <script   type= "text/javascript ">

        //   选择   GridView   中指定的   checkbox

        function   chkAll(sender)

        {

                var   grd   =   document.getElementById( "GridView1 ");

                var   chkArr   =   grd.getElementsByTagName( "input ");

                for(var   i   =   0;   i   <   chkArr.length;   i++)   {

                        if(chkArr[i].type   ==   "checkbox "   &&

                                chkArr[i].id.indexOf( "chkItem ")   >   -1)   {

                                chkArr[i].checked   =   sender.checked;

                        }

                }

        }

        //   同步chkItem和chkAll

        function   chkItem(sender)

        {

                var   grd   =   document.getElementById( "GridView1 ");

                var   chkArr   =   grd.getElementsByTagName( "input ");

                var   chkAll;

                for(var   i   =   0;   i   <   chkArr.length;   i++)   {

                        if(chkArr[i].type   ==   "checkbox "   &&

                                chkArr[i].id.indexOf( "chkAll ")   >   -1)   {

                                chkAll   =   chkArr[i];

                                break;

                        }

                }

                for(var   i   =   0;   i   <   chkArr.length;   i++)   {

                        if(chkArr[i].type   ==   "checkbox "   &&

                                chkArr[i].id.indexOf( "chkItem ")   >   -1   &&

                                !chkArr[i].checked)   {

                                chkAll.checked   =   false;

                                return;

                        }

                }

                chkAll.checked   =   true;

        }

        </script>

</head>

<body>

        <form   id= "form1 "   runat= "server ">

        <div>

                <asp:GridView   ID= "GridView1 "   runat= "server "   AutoGenerateColumns= "false ">

                        <Columns>

                                <asp:TemplateField>

                                        <HeaderTemplate>

                                                <asp:CheckBox   ID= "chkAll "   οnclick= 'chkAll(this) '   runat= "server "   />

                                        </HeaderTemplate>

                                        <ItemTemplate>

                                                <asp:CheckBox   ID= "chkItem "   οnclick= 'chkItem() '   runat= "server "   />

                                        </ItemTemplate>

                                </asp:TemplateField>

                                <asp:TemplateField   HeaderText= "ProductName ">

                                        <ItemTemplate>

                                                <%#   Eval( "ProductName ")   %>

                                        </ItemTemplate>

                                </asp:TemplateField>

                                <asp:BoundField   DataField= "UnitPrice "   HeaderText= "UnitPrice "   />

                        </Columns>

                </asp:GridView>

        </div>

        </form>

</body>

</html>