整理工作~

完整的代码在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 重建表头/单击单元格弹出对话框/改变单元格背景色的更多相关文章

  1. qtableview 鼠标划过单元格弹出标签显示单元格内容

    QStandardItem *item = new QStandardItem(show_content); infoTableModel->setItem(1, 1, item); item- ...

  2. java selenium (十一) 操作弹出对话框

    Web 开发人员通常需要利用JavaScript弹出对话框来给用户一些信息提示, 包括以下几种类型 阅读目录 对话框类型 1.  警告框: 用于提示用户相关信息的验证结果, 错误或警告等 2. 提示框 ...

  3. dos命令弹出对话框---Msg命令详解

    标签: dos批处理对话框 2015-11-12 17:20 497人阅读 评论(0) 收藏 举报 脚本(30)  版权声明:本文为博主原创文章,未经博主允许不得转载. dos命令弹出对话框---Ms ...

  4. NET使用了UpdatePanel后如何弹出对话框!

    原文:NET使用了UpdatePanel后如何弹出对话框! 在ajax中的UpdatePanel弹出对话窗,可以使用: ScriptManager.RegisterStartupScript(Upda ...

  5. JavaScript中的三种弹出对话框

    学习过js的小伙伴会发现,我们在一些实例中用到了alert()方法.prompt()方法.prompt()方法,他们都是在屏幕上弹出一个对话框,并且在上面显示括号内的内容,使用这种方法使得页面的交互性 ...

  6. js弹出对话框的三种方式(转)

    原文地址:https://www.jb51.net/article/81376.htm javascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prom ...

  7. 02 - Unit06:弹出对话框

    弹出对话框 如何实现弹出 //弹出出对话框 $("#can").load("alert/alert_notebook.html"); //显示背景色 $(&qu ...

  8. [Firefox附加组件]0003.弹出对话框

    Firefox中使用面板(panel)模块来显示弹出对话框,面板的内容通过HTML编写.你可以在面板上运行content script,尽管在面板里的脚本无法直接访问插件代码,但是你可以在面板脚本和插 ...

  9. 10.JAVA之GUI编程弹出对话框Dialog

    在上节基础上添加对话框显示错误信息. 代码如下: /*弹出对话框显示错误信息,对话框一般不单独出现,一般依赖于窗体.*/ /*练习-列出指定目录内容*/ import java.awt.Button; ...

随机推荐

  1. Canvas 阴影效果

    shadow <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  2. 如何做到Zero Downtime重启Go服务?

    graceful的实践 使用endless库来实现,比如接入gin: r := gin.Default() r.GET("/", index) endless.ListenAndS ...

  3. 锁 和 CopyOnWrite的实现

    1.普通锁 只有lock功能, Java实现:ReentrantLock lock = new ReentrantLock(); lock和unlock: lock.lock(); lock.unlo ...

  4. We Chall-Training: LSB-Writeup

    MarkdownPad Document html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,ab ...

  5. ArcGIS Desktop 10.5 安装实录

    ArcGIS Desktop 10.5 安装实录 by 李远祥 几天前已经收到ArcGIS10.5的最终版安装介质,终于有时间可以安装一下.尽管ArcGIS10.5系列中,桌面软件不是主角,但笔者还是 ...

  6. OVS VxLAN Flow 分析 - 每天5分钟玩转 OpenStack(149)

    OVS 的数据流向都是由 Flow 规则控制的,今天我们就来分析 VxLAN 的 Flow 规则.提个醒:这可能是本教程最烧脑的一节,let's rock it ! 下面分析控制节点上的 flow r ...

  7. 移动HTML5前端性能优化总结

    概述 1. PC优化手段在Mobile侧同样适用 2. 在Mobile侧我们提出三秒种渲染完成首屏指标 3. 基于第二点,首屏加载3秒完成或使用Loading 4. 基于联通3G网络平均338KB/s ...

  8. 网络攻击技术开篇——SQL Injection

    本文转自: http://www.cnblogs.com/rush/archive/2011/12/31/2309203.html 1.1.1 摘要 日前,国内最大的程序员社区CSDN网站的用户数据库 ...

  9. chrome浏览器360浏览器图片无法加载提示等待可用套接字问题

    前端时间遇到chrome,360浏览器无法加载图片问题,提示等待可用的套接字 后来发现原因,原来是使用html5<video>标签时使用了默认的配置,默认情况下<video>标 ...

  10. esri-leaflet入门教程(4)-加载各类图层

    esri-leaflet入门教程(4)-加载各类图层 by 李远祥 在leaflet中图层一般分为底图(Basemap)和叠加图层(Overlay).前面章节已经介绍过底图其实也是实现了TileLay ...