开发者社区> 金色海洋> 正文

一个页面搞定几乎所有的列表需求的实现思路和一点代码。

简介:      前情回顾 分页控件的使用能不能再简单一点呢,能不能一个页面搞定所有的列表需求?        其实如果要单独实现一个能够显示数据的表格,那么是很简单的,写一个for循环,把DataTable里面数据循环出来就OK了。
+关注继续查看

 

     前情回顾 分页控件的使用能不能再简单一点呢,能不能一个页面搞定所有的列表需求?

 

     其实如果要单独实现一个能够显示数据的表格,那么是很简单的,写一个for循环,把DataTable里面数据循环出来就OK了。相信大家都会做吧,如果是从asp走过来的应该更不陌生吧。

     上一篇说了,我们要根据表里面的记录来确定显示哪些列,哪一列在前,哪一列在后。那么怎么做呢?我们先定义一个类来存放这些信息。

 

 public class GridColumnsInfo
    {
        public int ColumnID = 0;
      public string ColSysName = "";
        public string ColName = "";
        public string ColType = "";
        public string ColWidth = "";
        public string ColAlign = "";
        public string Format = "";
        public int MaxLength = 0;

    }

 

     然后我们继承 System.Web.UI.WebControls.DataBoundControl,来创建一个自己的显示数据的控件。GridView就是继承的这个基类,我们也先照猫画虎来一个吧。public class myGrid : DataBoundControl    {}

 

     DataBoundControl 已经为我们做了不少的事情,比如定义了DataSource属性,还有DataBind()事件,其他的属性、事件我们暂时用不到,就先不管了。DataSource直接用就可以了,不用修改;而DataBind()就需要override一下了。

 

     我们还要先定义一个 Dictionary,用于存放GridColumnsInfo集合。然后写一个public void LoadGridColumnsInfo()函数来加载信息。

 public Dictionary<int, GridColumnsInfo> dic_GridCols ;

 

DataBind() 里面主要分为两个部分,第一部分绘制页眉,第二部分就是循环数据了。

 #region 输出页眉
            str.Append("<TR class=\"css_GridTR\">");
           
            foreach (KeyValuePair<int, GridColumnsInfo> entry in dic_GridCols)
            {
                str.Append("<TD>");
                str.Append(((GridColumnsInfo)entry.Value).ColName);
                str.Append("</TD>");
            }
            str.Append("</TR>");
            #endregion


     然后是循环输出数据,感觉这些也没有什么好说的,自己都觉得挺苦燥的。还是说一下行交替颜色的实现方法吧。用控件的形式输出一个table,首先要处理的就是样式,表格的样式要足够的灵活,否则的话就会有不好用的感觉。GridView用了很多的属性来进行描述,这个太复杂了,不和人家学了,来个简单一点的吧。样式/CSS,恩,就交给CSS来处理吧,定义几个css:

 

css_Grid1 :描绘table,
css_GridTR:描绘页眉,
td:控制td,
css_TR_c1、css_TR_c2、css_TR_c3...css_TR_cn: 来定义行交替色,这个数量就看要用多少种颜色来进行

交替了。

css_TR_move :鼠标经过时的样式;
css_TR_CK: 鼠标单击杭的样式。

 

     最后就是写几个js函数来控制鼠标经过和单击的效果。

     这里有演示效果。http://www.cnblogs.com/jyk/archive/2008/07/28/1255077.html

 

     好像有点乱。这里主要是想说如何根据配置信息来显示table,但是好像变成了介绍如何实现行的交替变色和点击行变色了。

 

     在下面就要做表单控件了。整理成一个完整一点的示例,在提供源码吧。

 

附源码:

 

img_405b18b4b6584ae338e0f6ecaf736533.gifimg_1c53668bcee393edac0d7b3b3daff1ae.gif/**//// <summary>
    
/// 专门显示数据的控件
    
/// </summary>

    [DefaultProperty("Text")]
    [ToolboxData(
"<{0}:myGrid runat=server></{0}:myGrid>")]
    
public class myGrid : DataBoundControl 
img_405b18b4b6584ae338e0f6ecaf736533.gifimg_1c53668bcee393edac0d7b3b3daff1ae.gif    
{
img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif        
==============================句柄==============================#region ==============================句柄==============================
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 访问数据库用的实例
        
/// </summary>

        private DataAccessHelp dal = null;
        
#endregion


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif        
数据访问实例的设置#region 数据访问实例的设置
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 设置数据访问层的实例
        
/// </summary>

        public DataAccessHelp DAL
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
{
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
set { dal = value; }
            
get
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                
if (dal == null)
                    dal 
= new DataAccessHelp();

                
return dal;
            }

        }

        
#endregion


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif        
成员和属性#region 成员和属性

img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif        
模块ID#region 模块ID
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 模块ID
        
/// </summary>

        private string _FunctionID = "";

img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 模块ID
        
/// </summary>

        [Bindable(true)]
        [Category(
"配置信息")]
        [Localizable(
true)]
        [Description(
"模块ID,用于提取配置信息")]
        
public string FunctionID
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
{
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
set { _FunctionID = value; }
            
get
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                
return _FunctionID;
            }

        }

        
#endregion


        
#endregion



img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 存放列表用的字段的描述信息,key:字段ID,value:GridColumnsInfo
        
/// </summary>

        public Dictionary<int, GridColumnsInfo> dic_GridCols ;//= new Dictionary<int, GridColumnsInfo>();

img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif        
从数据库的配置信息里面提取列表用的字段信息#region 从数据库的配置信息里面提取列表用的字段信息
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 从数据库的配置信息里面提取列表用的字段信息
        
/// </summary>

        public void LoadGridColumnsInfo()
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
{
            
string sql = "select * from _V_Use_ListCol where FunctionID=" + FunctionID;

            DataTable dt 
= DAL.RunSqlDataTable(sql);
            
if (dal.ErrorMsg.Length > 2)
                
return;

            
if (dt.Rows.Count == 0)
                
return;

            dic_GridCols 
= new Dictionary<int, GridColumnsInfo>();

            
foreach (DataRow dr in dt.Rows)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                GridColumnsInfo info 
= new GridColumnsInfo();
                info.ColumnID  
= Int32.Parse(dr["ColumnID"].ToString());
                info.ColSysName  
= dr["ColSysName"].ToString();
                info.ColName  
= dr["ColName"].ToString();
                info.ColWidth  
= dr["ColWidth"].ToString();
                info.ColAlign 
= dr["ColAlign"].ToString();
                info.ColType  
= dr["ColType"].ToString();
                info.Format 
= dr["Format"].ToString();
                info.MaxLength 
= Int32.Parse(dr["MaxLength"].ToString());

                dic_GridCols.Add(info.ColumnID, info);

            }


            
//dal.Dispose();
        }

        
#endregion


img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
/**//// <summary>
        
/// 绑定数据
        
/// </summary>

        public override void DataBind()
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif        
{
            
if ((base.Site != null&& base.Site.DesignMode)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                
//设计模式,退出
                return;
            }


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif            
加载配置信息#region 加载配置信息
            
if (dic_GridCols == null)
                LoadGridColumnsInfo();

            
//没有配置信息,退出
            if (dic_GridCols == null)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                CommandClass.MsgBox(
"没有设置配置信息"true);
                
return;
            }

            
#endregion


            System.Text.StringBuilder str 
= new StringBuilder(1000);
            str.Append(
"<Table class=\"css_Grid\">");
                   
 
img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif            
输出页眉#region 输出页眉
            str.Append(
"<TR class=\"css_GridTR\">");
            
            
foreach (KeyValuePair<int, GridColumnsInfo> entry in dic_GridCols)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                str.Append(
"<TD>");
                str.Append(((GridColumnsInfo)entry.Value).ColName);
                str.Append(
"</TD>");
            }

            str.Append(
"</TR>");
            
#endregion


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif            
输出数据#region 输出数据
            
if (this.DataSource != null)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif            
{
                
//输出js脚本
                System.Text.StringBuilder js = new StringBuilder();
                js.Append(
"<script >var myGridDataID = \"\"</script>");
                
base.Page.Response.Write(js.ToString());

                
if (this.DataSource is DataTable)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                
{
                    DataTable dt 
= (DataTable)this.DataSource;
           
                    Int32 i 
= 0;
                    GridColumnsInfo info;   
//循环里面的字段信息
                    string tmpValue;        //循环里的字段值
                    string DataID = "";     //数据主键值
                    string IDColumn = "";   //主键的字段名

img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                    
主键的字段名#region 主键的字段名
                    IDColumn 
= dal.RunSqlGetFirstColValue("select IDColumn from Manage_Function_Info where FunctionID= "+ this.FunctionID);
                    
#endregion


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                    
定义交替次数#region 定义交替次数
                    
int t = 0;
                    
#endregion


                    
foreach (DataRow dr in dt.Rows)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                    
{
                        
//获取主键字段的值
                        DataID = dr[IDColumn].ToString();

                        str.Append(
"<TR class=\"css_TR_c");
                        str.Append(t % 2 + 1); t++;
                        str.Append(
"\" onmousemove=\"Move(this)\" onmouseout=\"Out(this)\" onclick=\"Ck(this,'");
                        str.Append(DataID);
                        str.Append(
"')\" ondblclick=\"DbCK(me)\">");

                        
foreach (KeyValuePair<int, GridColumnsInfo> entry in dic_GridCols)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                        
{
                            info 
= (GridColumnsInfo)entry.Value;

                            
                            str.Append(
"<TD ");
img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                            
align#region align
                            
if (info.ColAlign != "left")
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                            
{
                                str.Append(
"Align=\"");
                                str.Append(info.ColAlign);
                                str.Append(
"\" ");
                            }

                            
#endregion


img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                            
width#region width
                            
if (info.ColWidth != "0")
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                            
{
                                str.Append(
"width=\"");
                                str.Append(info.ColWidth);
                                str.Append(
"\" ");
                            }

                            
#endregion


                            str.Append(
">");

img_7a2b9a960ee9a98bfd25d306d55009f8.gifimg_2887d91d0594ef8793c1db92b8a1d545.gif                            
设置数据的长度和格式#region 设置数据的长度和格式
                            tmpValue 
= dr[info.ColSysName].ToString();
                            
if (info.MaxLength != 0)
                                tmpValue 
= Functions.strCal(tmpValue, info.MaxLength);

                            
if (info.Format.Length != 0)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                            
{
                                
//判断数据库的字段类型,然后先转换再格式化。
                                switch (info.ColType)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                                
{
                                    
case "bigint":
                                        tmpValue 
= string.Format(info.Format, Int64.Parse(tmpValue));
                                        
break;
                                    
                                    
case "int":
                                    
case "smallint":
                                    
case "tinyint":
                                        tmpValue 
= string.Format(info.Format, Int32.Parse(tmpValue));
                                        
break;

                                    
case "datetime":
                                    
case "smalldatetime":
                                        
if (tmpValue.Length > 0)
img_2887d91d0594ef8793c1db92b8a1d545.gifimg_7a2b9a960ee9a98bfd25d306d55009f8.gif                                        
{
                                            DateTime tmpTime 
= DateTime.Parse(tmpValue);
                                            
if (tmpTime <= DateTime.Parse("1900-1-2"))
                                                tmpValue 
= "";  //不显示1900-1-1这样的日期
                                            else
                                                tmpValue 
= string.Format(info.Format, tmpTime);
                                        }

                                        
break;

                                    
case "decimal":
                                    
case "money":
                                    
case "smallmoney":
                                    
case "numeric":
                                        tmpValue 
= string.Format(info.Format, decimal.Parse(tmpValue));
                                        
break;

                                    
case "float":
                                    
case "real":
                                        tmpValue 
= string.Format(info.Format, float.Parse(tmpValue));
                                        
break;

                                        
//其他类型不格式化
                                }

                            }

                            
#endregion


                            str.Append(tmpValue);
                            str.Append(
"</TD>"); 
                        }

                        str.Append(
"</TR>");
                    }

                }

            }

            
#endregion


            str.Append(
"</Table>");

            
this.Controls.Add(new LiteralControl(str.ToString()));

        }


    }

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Vue入门 基本使用 与 事务管理【1】
Vue入门 基本使用 与 事务管理【1】
10 0
8 月份 GitHub 最火的 6 个 Java 开源项目
8 月份 GitHub 上最热门的 Java 开源项目排行新鲜出炉,一起来看看~
7 0
冬季实战营第一期:从零到一上手玩转云服务器 | 学习报告
训练营日期:2022年1月17日 - 2022年1月23日 需要先报名后学习,实际是17-21共5天5个场景的学习,链接地址:https://developer.aliyun.com/adc/series/wintercamplist1?spm=a2c6h.26268694.J_3660455150.2.503610f8RnszVx 我是5月份学习的,并没有实时参加训练营,因为觉着本次训练营课程设置很实用,所以对本次学习做个总结。
6 0
比赛-以企业为服务目标的政策大数据应用
比赛-以企业为服务目标的政策大数据应用
5 0
心中有“树”!图文并茂介绍数据结构中常见的树(一)
提到数据结构中的树(Tree) ,大家应该都不陌生,相关书籍中都有大段篇幅的介绍,刷 Leetcode 的时候会遇到很多相关问题。很多人往往会用 “手写红黑树” 来形容面试难度很高。
10 0
心中有“树”!图文并茂介绍数据结构中常见的树(二)
计算机科学家尼古拉斯·沃斯(Niklaus Wirth)曾说过:编程=数据结构+算法 ,可见数据结构在编程中的重要性。
5 0
心中有“树”!图文并茂介绍数据结构中常见的树(三)
在前面两篇文章中,我们简要介绍了数据结构中的各种【树】在搜索、数据库等领域的使用场景,希望对大家有所帮助。
11 0
如何在小游戏制作工具中使用云函数
本节试图以最简单的方式带你了解如何在小程序后台申请和开通云开发服务,创建并编写第一个云函数并在小游戏制作工具中对其进行调用。
11 0
+关注
金色海洋
算法相关技术专家
323
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载