怎樣添加設置GridView,CheckBox全選功能
GridView內CheckBox控件全選設置
不需要添加後台代碼操作,前端即可完成設置,如下:
前端代碼:
1.設置javascript。
<html xmlns="http://www.w3.org/1999/xhtml" >
<script type="text/javascript">
function CheckAll3(oCheckbox)
{
var GridView3 = document.getElementById("<%=GridView1.ClientID %>");
for(var i = 1; i < GridView1.rows.length; i++)
{
GridView1.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
}
}
</script>
2.body內代碼:
<asp:GridView ID="GridView1" runat="server" Height="2px" Width="720px" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="1" AllowPaging="True" OnPageIndexChanging="GridView1_PageIndexChanging" OnRowDataBound="GridView1_RowDataBound" OnRowDeleting="GridView1_RowDeleting" AutoGenerateColumns="False" PageSize="8" >
<RowStyle ForeColor="#000066" />
<FooterStyle BackColor="White" ForeColor="#000066" />
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:Label ID="lbuid" runat="server" Visible="false" Text='<%# Eval("data") %>'></asp:Label>
</ItemTemplate>
<HeaderTemplate>
<input type="checkbox" id="ChkHead" onclick="CheckAll3(this)" title="選擇全部" />
<%--<asp:CheckBox ID="CheckBoxALL" runat="server" AutoPostBack="True" />--%>
</HeaderTemplate>
<HeaderStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
<asp:BoundField DataField="data" HeaderText="日期(data)" ReadOnly="True" />
<asp:BoundField DataField="users" HeaderText="姓名(users)" SortExpression="姓名" />
<asp:BoundField DataField="user_name" HeaderText="賬號(user_name)" />
<asp:BoundField DataField="user_email" HeaderText="郵箱(user_email)" />
<asp:BoundField DataField="mony" HeaderText="金額(mony)" />
</Columns>
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" CssClass="Freezing" />
</asp:GridView>
怎樣添加設置GridView,CheckBox全選功能的更多相关文章
- GridView CheckBox 全选
GridView CheckBox 全选 <script type="text/javascript"> $(function () { $("#allChe ...
- js初学—实现checkbox全选功能
布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...
- checkbox 全選、取消全選、反選
在寫一個全選.取消全選.反選的功能時. 未來元素[type='checkbox'],在使用了jquery-1.11.1.min.js版本的jquery時: 功能版本1: 存在的問題,當使用了attr時 ...
- Form - CHECKBOX全选功能
FORM BUILDER开发,遇到这样一个需求: 添加一个CHECKBOX完成全选功能,红框为新添加的CHECKBOX(如图示) Try to use APP_RECORD.FOR_ALL_RECOR ...
- [置顶] 用mootools实现checkbox全选功能
全选时,所有的单个checkbox都要选中,反过来也可以实现 //全选按钮 $('chkall').addEvent('click',function(){ $$('input[name=" ...
- checkbox全选功能
$("#cb_classType_all").change(function () { if ($(this).is(":checked")) { $(&quo ...
- 實現多个checkbox單選功能(转)
<script type="text/javascript"> function check(obj) { var checkbox ...
- gridview checkbox从服务器端和客户端两个方面实现全选和反选
GridView中的checkbox的全选和反选在很多的地方都是要求实现的,所以下面就从服务器端和客户端两个方面实现了checkbox的选择,感兴趣的朋友可以了解下,希望本文对你有所帮助 GridVi ...
- 設置Linux保留物理內存並使用 (1)
在Linux系統中可以通過memblock來設置系統保留物理內存,防止這些內存被內存管理系統分配出去. 作者: 彭東林 郵箱: pengdonglin137@163.com 平臺 硬件平臺: TQ24 ...
随机推荐
- java之servlet入门操作教程一续
本节主要是在java之servlet入门操作教程一 的基础上使用myeclipse实现自动部署的功能 准备: java之servlet入门操作教程一 中完成myFirstServlet项目的创建: ...
- css控制UL LI 的样式详解(推荐)
代码如下: <div id="menu"> <ul> <li><a href="#">首页</a>& ...
- 联发科Helio P90,MT6779VWB芯片处理器
联发科(p90)MT6779VWB芯片是一个集成了蓝牙.fm.wlan和gps模块的高度集成的基带平台,包括调制解调器和应用处理子系统.支持LTE/LTE-A和C2K智能手机应用程序.该芯片集成了两个 ...
- java安全入门篇之接口验签
文章大纲 一.加密与验签介绍二.接口验签实操三.项目源码下载 一.加密与验签介绍 大多数公共网络是不安全的,一切基于HTTP协议的请求/响应(Request or Response)都是可以被 ...
- Centos 7 django环境搭建
1.本机网卡配置信息如下: vim /etc/sysconfig/network-scripts/ifcfg-ens33 TYPE=Ethernet PROXY_METHOD=none BROWSER ...
- 开源干货!!!.NET Core + JWT令牌认证 + Vue.js(iview-admin) 通用动态权限(RBAC)管理系统框架[DncZeus]开源啦!!!
DncZeus 前言 关于 DncZeus DncZeus = Dnc + Zeus "Dnc"--.Net Core 的缩写: "Zeus"--中文译为宙斯, ...
- Java Socket聊天室编程(一)之利用socket实现聊天之消息推送
这篇文章主要介绍了Java Socket聊天室编程(一)之利用socket实现聊天之消息推送的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下 网上已经有很多利用socket实现聊天的例子了 ...
- Netty、t-io、Voovan 框架比较
以下是对三个框架在设计或者说是编码特点中选取的几个我比较关注的点的对比图: 首先我们对几个关键的概念进行一些解析,方便大家更好的理解上面表中的概念: NIO.AIO 的区别? 在这里我们来看一下两者最 ...
- 常用Latex公式
注意: 1 在博客中书写Latex公式时,需在公式两侧用$包括 2 大括号{ }在Latex有本身的含义,如果要输出为普通字符需要使用\{...\} 符号 公式 说明 $ \in $ \in 包含 $ ...
- Snipaste多截屏工具软件
Snipaste是一个简单的截图小工具,可以支持同时截取多张图片,添加标注等等,操作简单方便,解压即用 百度网盘链接: https://pan.baidu.com/s/1YC75DRoLzdeyli1 ...