[ASP.NET] [JS] GridView点击高亮当前选择行,并在点击另一行时恢复上一选择行背景颜色
在ASP.NET中的gridview控件里面可以通过设定其OnRowDataBound事件来进行实现高亮当前行的操作
前端控件的设置:
只要设置好OnRowDataBound属性即可,会自动在.cs文件中生成对应的方法
<asp:GridView ID="ufTable" runat="server" AutoGenerateColumns="False" AllowSorting="True" CssClass="GridViewStyle" EmptyDataText="表目前為空" OnRowDataBound="ufTable_RowDataBound">
后台方法的实现:
执行之前一定要先进行判断是否属于datarow类型的行,否则会出错
protected void ufTable_RowDataBound(object sender, GridViewRowEventArgs e) { #region 高亮當前行,執行前一定要判斷是否屬於datarow!! if (e.Row.RowType == DataControlRowType.DataRow)//判定当前的行是否属于datarow类型的行 { e.Row.Attributes.Add("onclick ", "showColor(this) ");//用腳本實現,避免上一行顏色沒有還原 } #endregion }
js代码的实现:
//高亮當前行 function showColor(obj) { var rowindex = obj.rowIndex; obj.style.backgroundColor = '#ffbb54 '; for (var i = 1; i < obj.parentElement.rows.length; i++) { if (i != rowindex) { obj.parentElement.rows[i].style.backgroundColor = "#ffffff "; } } }
效果图:
点击第二行,恢复第一行背景颜色
[ASP.NET] [JS] GridView点击高亮当前选择行,并在点击另一行时恢复上一选择行背景颜色的更多相关文章
- 实现点击cell实现改变cell和cell上控件的背景颜色
话不多少,贴上代码吧!!! // // ViewController.m // CellChangeBgColorDemo // // Created by 思 彭 on 17/1/12. // Co ...
- cesium 3dtiles模型单体化点击高亮效果
前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. c ...
- iOS 创建多个button实现点击改变背景颜色
工程中需要实现与UISegmentedControl效果相似的一排一共十个button,如下图.但是SegmentedControl修改不太方便,就用button替代, 循环创建十个button,点击 ...
- Asp.net中GridView详解《转》
ASP.NET服务器控件GridView 1 ASP.NET 服务器控件GridView使用 本教程不介绍服务器端控件的呈现,事件处理,状态等理论知识,只介绍服务器端控件的使用操作,如 ...
- Asp.net中GridView使用详解(引)【转】
Asp.net中GridView使用详解(引) GridView无代码分页排序 GridView选中,编辑,取消,删除 GridView正反双向排序 GridView和下拉菜单DropDownList ...
- asp.net教程:GridView导出到Excel或Word文件
asp.net教程:GridView导出到Excel或Word文件</ br> 在项目中我们经常会遇到要求将一些数据导出成Excel或者Word表格的情况,比如中国移动(我是中国移动用户) ...
- echarts 折线图点击高亮
echarts中注册事件很多 ,记录下今天做的折线图点击高亮: 查了api,看了半天,发现折线图点击时只能做到圆点变大,并不能实现点击线条,整条线条高亮,也真是醉了. 上图: 如图所示,只能圆点变大. ...
- Asp.net中GridView使用详解(很全,很经典 转来的)
Asp.net中GridView使用详解 效果图参考:http://hi.baidu.com/hello%5Fworld%5Fws/album/asp%2Enet中以gv开头的图片 l ...
- ASP.NET js控制treeview中的checkbox实现单选功能
ASP.NET js控制treeview中的checkbox实现单选功能 function OnTreeNodeChecked() { var element = window.event.srcEl ...
随机推荐
- JavaScript基础——JavaScript函数(笔记)
avaScript 函数(笔记) JavaScript 是函数式编程语言,在JavaScript脚本中可以随处看到函数,函数构成了JavaScript源代码的主体. 一.定义函数 定义函数的方法有两种 ...
- 数组 slice方法和splice方法的区别
一.slice() 方法 slice()方法可以从已有的数组中返回选定的元素. 语法: arrayObject.slice(start,end) 参数: start:(截取开始位置的索引,包含开始索引 ...
- RabbitMQ消费端限流策略(十)
消费端限流: 什么是消费端限流? 场景: 我们RabbitMQ服务器有上万条未处理的消息,我们随便打开一个消费者客户端,会出现下面情况: 巨量的消息瞬间全部推送过来,但是我们单个客户端无法同时处理这么 ...
- flink⼿手动维护kafka偏移量量
flink对接kafka,官方模式方式是自动维护偏移量 但并没有考虑到flink消费kafka过程中,如果出现进程中断后的事情! 如果此时,进程中段: 1:数据可能丢失 从获取了了数据,但是在执⾏行行 ...
- JS框架_(JQuery.js)网页文字评论弹幕
百度云盘 传送门 密码:3azl jQuery网页右下角文字评论弹幕效果 <!DOCTYPE html> <html> <head> <title>jQ ...
- JS框架_(JQuery.js)高德地图api
百度云盘 传送门 密码 :ko30 高德地图api效果 <!doctype html> <html> <head> <meta charset="u ...
- vue计算属性详解
一.什么是计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> ...
- iOS13即将到来,iOS推送Device Token适配方案详解
关于提前适配iOS13 苹果推送DeviceToken的通知 随着苹果iOS13系统即将发布,个推提前推出DeviceToken适配方案,以确保新版本的兼容与APP推送服务的正常使用.iOS13的一个 ...
- Django日志的配置
做开发离不开日志,以下是我在工作中写Django项目常用的logging配置. BASE_LOG_DIR = os.path.join(BASE_DIR, "log") LOG ...
- OkHttp3 使用详解
一,简介 OkHttp 是一个高效的 HTTP 客户端,具有非常多的优势: 能够高效的执行 http,数据加载速度更快,更省流量 支持 GZIP 压缩,提升速度,节省流量 缓存响应数据,避免了重复的网 ...