Gridview 重建表头/单击单元格弹出对话框/改变单元格背景色
整理工作~
完整的代码在GitHub上, 路径:
项目背景:追踪某个issue,并且记录每天的状态。
要求:1、点击日期就能更改,并且用颜色标志不同的状态
2、增加按钮可关闭issue
3、布局要求日期横排放在追踪信息之后
刚拿到这简短干练的需求之后,有点懵,sample图都没有,都凭自己想象了。主要提需求的都是一群完全不懂开发的人,真的是完全、完全、完全不懂!!!怀念在软件公司的日子。。。。。。
大概想了一下,画了张类似下面截图的草图并且根据要求详细地写了一份Specification,一致通过之后,就开始准备写这个功能了。。。。
废话不多说,直接看图和代码吧~
效果图:

前台.aspx 代码比较简短,只绑定了一个不可见的ButtonField, 用于单元格单击事件
后台主要代码片断
重建表头在事件gvData_RowCreated里面
switch (e.Row.RowType)
{
case DataControlRowType.Header:
TableCellCollection tcHeader = e.Row.Cells;
tcHeader.Clear();
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxx.";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "xxxxx";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "Status";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "Remarks";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Text = "Month";
tcHeader.Add(new TableHeaderCell());
tcHeader[].Attributes.Add(");
tcHeader[].Text = "xxxx Data";
break;
}
单击事件代码, 首先需要设置从哪一列开始可单击弹出框,然后在RowDataBound事件中允许单击并弹出框
if (e.Row.RowType == DataControlRowType.DataRow)
{
LinkButton _singleClickButton = (LinkButton)e.Row.Cells[].Controls[];
string _jsSingle = ClientScript.GetPostBackClientHyperlink(_singleClickButton, "");
//add events to each editable cell
for (int columnIndex = _firstEditCellIndex; columnIndex < e.Row.Cells.Count; columnIndex++)
{
//add the column index as the event argument parameter
, columnIndex.ToString());
e.Row.Cells[columnIndex].Attributes["onclick"] = js;
e.Row.Cells[columnIndex].Attributes["style"] += "cursor:pointer;cursor:hand;";
e.Row.Cells[columnIndex].Attributes.Add("onclick", "openWin('" + requestNo + "','" + month + "','" + date + "');");
}
}
改变单元格背景色同样在RowDataBound中
if (date.Contains("P"))
{
date = date.TrimEnd('P');
e.Row.Cells[columnIndex].BackColor = ColorTranslator.FromHtml("#525f6b");
}
if (date.Contains("Y"))
{
date = date.TrimEnd('Y');
e.Row.Cells[columnIndex].BackColor = ColorTranslator.FromHtml("#fac970");
}
if (date.Contains("L"))
{
date = date.TrimEnd('L');
e.Row.Cells[columnIndex].BackColor = ColorTranslator.FromHtml("#15a452");
}
if (date.Contains("R"))
{
date = date.TrimEnd('R');
e.Row.Cells[columnIndex].BackColor = Color.Red;
}
if (date.Contains("B"))
{
date = date.TrimEnd('B');
e.Row.Cells[columnIndex].BackColor = ColorTranslator.FromHtml("#004986");
}
e.Row.Cells[columnIndex].Text = date;
设置Status列为单击可关闭列,代码如下
, .ToString());
e.Row.Cells[].Attributes["onclick"] = editJs;
e.Row.Cells[].Attributes["style"] += "cursor:pointer;cursor:hand;";
].Text == "Ongoing")
e.Row.Cells[].Text = "<img src='../Images/page_white_edit.png'/>";
].Text == "Closed")
e.Row.Cells[].Text = "<img src='../Images/accept-f.png'/>";
e.Row.Cells[].Attributes.Add("onclick", "openCloseWin('" + requestNo + "');");
可能实现的方法不是很好,请多指教~
Gridview 重建表头/单击单元格弹出对话框/改变单元格背景色的更多相关文章
- qtableview 鼠标划过单元格弹出标签显示单元格内容
QStandardItem *item = new QStandardItem(show_content); infoTableModel->setItem(1, 1, item); item- ...
- java selenium (十一) 操作弹出对话框
Web 开发人员通常需要利用JavaScript弹出对话框来给用户一些信息提示, 包括以下几种类型 阅读目录 对话框类型 1. 警告框: 用于提示用户相关信息的验证结果, 错误或警告等 2. 提示框 ...
- dos命令弹出对话框---Msg命令详解
标签: dos批处理对话框 2015-11-12 17:20 497人阅读 评论(0) 收藏 举报 脚本(30) 版权声明:本文为博主原创文章,未经博主允许不得转载. dos命令弹出对话框---Ms ...
- NET使用了UpdatePanel后如何弹出对话框!
原文:NET使用了UpdatePanel后如何弹出对话框! 在ajax中的UpdatePanel弹出对话窗,可以使用: ScriptManager.RegisterStartupScript(Upda ...
- JavaScript中的三种弹出对话框
学习过js的小伙伴会发现,我们在一些实例中用到了alert()方法.prompt()方法.prompt()方法,他们都是在屏幕上弹出一个对话框,并且在上面显示括号内的内容,使用这种方法使得页面的交互性 ...
- js弹出对话框的三种方式(转)
原文地址:https://www.jb51.net/article/81376.htm javascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prom ...
- 02 - Unit06:弹出对话框
弹出对话框 如何实现弹出 //弹出出对话框 $("#can").load("alert/alert_notebook.html"); //显示背景色 $(&qu ...
- [Firefox附加组件]0003.弹出对话框
Firefox中使用面板(panel)模块来显示弹出对话框,面板的内容通过HTML编写.你可以在面板上运行content script,尽管在面板里的脚本无法直接访问插件代码,但是你可以在面板脚本和插 ...
- 10.JAVA之GUI编程弹出对话框Dialog
在上节基础上添加对话框显示错误信息. 代码如下: /*弹出对话框显示错误信息,对话框一般不单独出现,一般依赖于窗体.*/ /*练习-列出指定目录内容*/ import java.awt.Button; ...
随机推荐
- Treeview显示磁盘下的文件,并且可操作
#region TreeView树形显示磁盘下文件夹 /// <summary> /// IconIndexs类 对应ImageList中5张图片的序列 /// </summary& ...
- HDU5916
Harmonic Value Description Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Ja ...
- SoapUI:mock service的使用
mock service就是服务模拟,当我们的接口完成而服务端还没完成的时候,我们就可以用mock service来替代服务端进行接口测试. 1.1 创建MockService 创建moc ...
- 【Spring-web】AsyncRestTemplate源码学习
2017-01-23 by 安静的下雪天 http://www.cnblogs.com/quiet-snowy-day/p/6343347.html 本篇概要 类说明 类图 简单例子 精辟的内部类 类 ...
- 《JAVASCRIPT高级程序设计》客户端检测
web开发的理想状态之一是浏览器支持一组最常用的功能,但是在现实情况下,浏览器间的差异非常大,因此,为了兼容大部分的了浏览器,开发人员首先需要设计最通用的方案,然后再使用客户端检测的技术增强该方案.客 ...
- NMEA-0183协议解析
NMEA-0183 NMEA 0183是美国国家海洋电子协会(National Marine Electronics Association )为海用电子设备制定的标准格式.目前业已成了GPS导航设备 ...
- 对Node.JS的事件轮询(Event Loop)的理解
title: Node.JS的事件轮询(event loop)的理解 categories: 理解 tags: Node JS 机制 当我们知道I/O操作和创建新线程的开销是巨大的! 网站延迟的开销 ...
- 基于canvas和jsp的头像剪辑上传
最近在做项目时候需要一个头像长传功能,但是现在照片动不动就几兆的,都是流量的浪费. 我只是简单想要上传一个头像而已... 经过几天发愤图强..总算是略有所获.. 基本思路: 1.html部分,图片剪辑 ...
- [Hadoop] - 异常Cannot obtain block length for LocatedBlock
在Flume NG+hadoop的开发中,运行mapreduce的时候出现异常Error: java.io.IOException: Cannot obtain block length for Lo ...
- Debug和Release区别
VC下Debug和Release区别 最近写代码过程中,发现 Debug 下运行正常,Release 下就会出现问题,百思不得其解,而Release 下又无法进行调试,于是只能采用printf方式逐步 ...