利用JavaScript选择GridView行
下面我们利用JavaScript完成这一功能。
我们可以通过调用JavaScirpt函数改变单击的行的背景颜色来模拟选择的行,这里需要声明一个隐藏字段,从JS中获得选取GridView行的ID。在选择/删除事件中,可以从隐藏字段中得到选择行的ID,完成一些需要功能。
第一步:在页面中添加GridView控件和一个按钮,隐藏字段
<input id="hdnEmailID" type="hidden"
value="0" runat="server" name="hdnEmailID" />
<asp:GridView ID="gvUsers" runat="server"
AutoGenerateColumns="False"
OnRowDataBound="gvUsers_RowDataBound">
<Columns>
<asp:BoundField DataField="Email" HeaderText="邮件" ReadOnly="True" />
<asp:BoundField DataField="Name" HeaderText="姓名" ReadOnly="True" />
</Columns>
</asp:GridView>
<asp:Button ID="btnSelect" runat="server"
OnClick="btnSelect_Click" Text="Select" />第二步:编写JS函数来获取选择行的id,并改变背景颜色
<script language="javascript" type="text/javascript">
var lastRowSelected;
var originalColor;
function GridView_selectRow(row, EmailID)
{
var hdn=document.form1.hdnEmailID;
hdn.value = EmailID;
if (lastRowSelected != row)
{
if (lastRowSelected != null)
{
lastRowSelected.style.backgroundColor = originalColor;
lastRowSelected.style.color = 'Black'
lastRowSelected.style.fontWeight = 'normal';
}
originalColor = row.style.backgroundColor
row.style.backgroundColor = 'BLACK'
row.style.color = 'White'
row.style.fontWeight = 'normal'
lastRowSelected = row;
}
}
function GridView_mouseHover(row)
{
row.style.cursor = 'hand';
}
</script>略过一步,就是绑定数据,大家自行完成。
第三步:在RowDataBound事件中添加JS函数调用。
protected void gvUsers_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.ID = e.Row.Cells[0].Text;
e.Row.Attributes.Add("onclick",
"GridView_selectRow(this,'" + e.Row.Cells[0].Text + "')");
e.Row.Attributes.Add("onmouseover", "GridView_mouseHover(this)");
}
}第四步:完成按钮事件
在选择/删除按钮单击事件我们可以用hdnEmailID.Value方式获得行的id。然后利用id来完成操作;这里为了演示,我只是输出了这个值。
protected void btnSelect_Click(object sender, EventArgs e)
{
Response.Write(hdnEmailID.Value);
}好了,这个技巧就介绍到这里了,大家试一试!
利用JavaScript选择GridView行相关推荐
- Tips/Tricks#3:利用JavaScript选择GridView行
利用JavaScript选择GridView行 本篇技巧和诀窍记录的是:利用JavaScript选择GridView行. 当我们想在GridView中添加删除.选择功能时,我们通常的做法是利用模板功能 ...
- 使用JavaScript选择GridView行的方法汇总
一行: e.Row.Attributes["onclick"] = ClientScript.GetPostBackClientHyperlink(this.gvUsers, &q ...
- linux下运行js挖矿,利用 JavaScript 代码挖矿
我们都知道,现在的比特币特别的火,但是错过了最好时代的我们,已经玩不起那个动不动就几万的矿机以及还需要翻山越岭迁移到深山发电站的决心.何况,目前比特币已经不再是如同神话一般的不断开创历史新高,该来的矿 ...
- 利用javascript和WebGL绘制地球 【翻译】
利用javascript和WebGL绘制地球 [翻译] 原翻译:利用javascript和WebGL绘制地球 [翻译] 在我们所有已知的HTML5API中,WebGL可能是最有意思的一个,利用这个AP ...
- EL之RF(随机性的Bagging+DTR):利用随机选择属性的bagging方法解决回归(对多变量的数据集+实数值评分预测)问题
EL之RF(随机性的Bagging+DTR):利用随机选择属性的bagging方法解决回归(对多变量的数据集+实数值评分预测)问题 目录 输出结果 设计思路 核心代码 输出结果 设计思路 核心代码 f ...
- 利用JavaScript在ASP.NET中动态生成系统菜单
用户在登陆一个系统后通常会因为权限的不同而使用不同的系统功能,我们在实现用户使用的菜单项时有两种选择,一是列出全部系统菜单项,根据用户的权限禁用一部分菜单,二是根据权限动态加载菜单,这样只要列出的 ...
- 如何为JavaScript选择文本编辑器
by Ayo Isaiah 通过Ayo Isaiah 如何为JavaScript选择文本编辑器 (How to choose a text editor for JavaScript) If you' ...
- 利用Javascript判断操作系统的类型
在通过Javascript实现客户端和服务端的交互时,有时候需要对操作系统进行判断,以便实现不同操作系统下的兼容性,比如:我们有一个网站, 在Windows XP下浏览效果良好,但是到了Ubuntu下 ...
- 利用javascript动态创建表格
//说明:实现功能.原理上文相同.不过这次是利用已有的简单的方法创建行和列,并实现内容行鼠标移入变色功能! 效果图: /*两个方法 1. trNode table.insertRow(-1) ...
最新文章
- python 根据字典中值的大小对项进行排序
- 【机器学习算法专题(蓄力计划)】一、机器学习简史和常用算法的梳理
- dex运行linux,随着三星最新的DeX更新,更多的手机可以使用Linux
- 图像识别:微信跳一跳机器人
- java文件编译为class文件需要键入什么命令_cmd命令行 编译Java 文件
- mongodb数据库扩展名_MongoDB权威指南
- networkx 中心势计算_科学网—复杂网络分析库NetworkX学习笔记(2):统计指标计算 - 闫小勇的博文...
- spark structured stream的Update模式
- 计算机组成原理中计算机主要包括哪几部分,计算机组成原理本科生期末试卷(五)部分答案详解...
- 白板推导系列Pytorch-逻辑回归
- 详解CSS中:nth-child的用法
- c语言程序设计教程实验指导吴国栋,C语言程序设计教程实验指导
- Excel怎么实现多列数据排列组合
- 缥缈峰--JVM系列之内存区域
- 利用android monkey 抢支付宝红包
- 如何批量修改文件名?教你一招,轻松解决
- 量化金融模型ARCH模型官方例程(中文翻译版)
- 系统学习机器学习之特征工程(一)--维度归约
- Google Play支付失败问题解决
- 开发资源总结 (转载)
热门文章
- C语言十六进制数转八进制(十进制作为中介)(附完整源码)
- C语言指针、数组与sizeof运算符
- c++对象拷贝语意学
- QML基础类型之matrix4x4
- springboot读取json文件_SpringBoot:配置文件属性读取
- lvm 多个硬盘合成一个_「ECS最佳实践」基于多块云盘构建LVM逻辑卷
- kerberos安装配置、配置kerberos server、client、日常操作与常见问题、卸载kerberos、hive整合kerberos
- 为指定的职工在原工资的基础上长10%的工资,并打印涨工资前和涨工资后的工资
- 检索数据_15_将空值转成其它值
- .mvn 需要放git上吗_下巴反复长痘,饮食上需要忌口吗?