给DataGrid中前添加CheckBox,全选和全不选问题,经典解决方案.

在head里添加js

  <script language="JavaScript">  
   function Selectallup(opt)  
   {    
    var c = document.Form1;  
                for(var i=0;i<c.elements.length;i++)  
                {    
     var box=c.elements.elements[i]                        
     box.checked=opt.checked;  
                }  
   }  
  </script>

DataGrid中html代码.

<asp:datagrid id="DataGrid1" runat="server" Width="100%" BorderWidth="1px" AutoGenerateColumns="False">
                <AlternatingItemStyle HorizontalAlign="Center" VerticalAlign="Middle"></AlternatingItemStyle>
                <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle"></ItemStyle>
                <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle"></HeaderStyle>
                <Columns>
                 <asp:TemplateColumn>
                  <ItemStyle Width="3%"></ItemStyle>
                  <HeaderTemplate>
                   <asp:CheckBox id="Checkbox2" runat="server" onclick="Selectallup(this)"></asp:CheckBox>
                  </HeaderTemplate>
                  <ItemTemplate>
                   <asp:CheckBox id="CheckBox1" runat="server"></asp:CheckBox>
                  </ItemTemplate>
                 </asp:TemplateColumn>
                 <asp:BoundColumn DataField="ZPRBMMC" ReadOnly="True" HeaderText="部门">
                  <ItemStyle Width="10%"></ItemStyle>
                 </asp:BoundColumn>
                 <asp:BoundColumn DataField="ZYGGH" ReadOnly="True" HeaderText="工号">
                  <ItemStyle Width="10%"></ItemStyle>
                 </asp:BoundColumn>

                </Columns>

</asp:datagrid>

 ===========================================================================

<script type="text/javascript">
    function checkAll() {
        var code_Values = document.getElementsByTagName("input");
        for (i = 0; i < code_Values.length; i++) {
            if (code_Values[i].type == "checkbox") {
                code_Values[i].checked = true;
            }
        }
    }
    function uncheckAll() {
        var code_Values = document.getElementsByTagName("input");
        for (i = 0; i < code_Values.length; i++) {
            if (code_Values[i].type == "checkbox") {
                code_Values[i].checked = false;
            }
        }
    }
  </script>

<table align="center" style="width:750px;" cellpadding="0" cellspacing="1" class="list">
   <thead>
        <tr  class="content_tr_header">
            <td width="15%">&nbsp;<a href="javascript:;" onclick="checkAll();">全选</a>/<a href="javascript:;" onclick="uncheckAll();">全不选</a></td>
            <td width="25%">&nbsp;预算科目编号</td>
            <td width="50%">&nbsp;预算科目名称</td>
            <td width="10%">&nbsp;是否显示</td>
        </tr>
    </thead>
    <tbody>
        <asp:Repeater ID="rptCostSubjectList" runat="server">
            <ItemTemplate>
            <tr class="list_body">
                <td>&nbsp;<asp:CheckBox ID="cb1" runat="server" Checked='<%# (Int32)Eval("State") == 1 ? true : false %>' />
                <asp:TextBox ID="txtID" runat="server" Text='<%# Eval("ID")%>' style="display:none;"></asp:TextBox></td>
                <td>&nbsp;<%#Eval("SAKNR")%></td>
                <td>&nbsp;<%# Eval("TXT50")%></td>
                <td>&nbsp;<%# (Int32)Eval("State") == 1 ? "是" : "否" %></td>
            </tr>
            </ItemTemplate>
        </asp:Repeater>
       
    </tbody>
    <tfoot>
        <tr>
            <td align="right" colspan="4">
                <uc1:UC_GetRecordsByPage ID="ucPager" runat="server" />
            </td>
        </tr>
    </tfoot>
</table>

 

posted on   秋天  阅读(547)  评论(0编辑  收藏  举报

编辑推荐:
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构

导航

< 2009年2月 >
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
1 2 3 4 5 6 7
8 9 10 11 12 13 14
点击右上角即可分享
微信分享提示