项目总结—jQuery EasyUI-DataGrid 拼表及查看详情


概要


        在上一篇文章中,我们将如何动态的显示表头进行了介绍,在上一篇文章中还提到一个问题,DataGrid显示的数据不是直接来自于数据库而是拼接而成,这个表又是怎么拼接而成的呢,这次我们就来学习下它的具体实现.

 


实现


        要实现的功能是,在表格中的"数据录入情况""计算情况"都是通过数据库中的一些信息的判断才得到表格中显示的"完成""未完成""计算""未计算",除此之外表格中有个"查看详情",点击查看详情还可以进行不同条件的跳转.

 

我们将效果再次展示一下,

 

项目总结—jQuery EasyUI-DataGrid 拼表及查看详情

 

跳转后的页面

项目总结—jQuery EasyUI-DataGrid 拼表及查看详情


 

 

下面我们来代码的具体实现,关于前台html页面的代码我们在上一篇文章"项目总结—jQuery EasyUI-DataGrid动态加载表头 "中已经写到了,我们重点来看下一般处理程序的实现。

 

 

       //县市区定性计算情况查询
        public voidQueryCityCharacterization(HttpContext context)
        {
            //声明并实例化县市区定性数据录入表
            CityCharacterizationVotesBLLcityCharacterizationVotesBLL = new CityCharacterizationVotesBLL();
            //声明并实例化定性指标
            CharacterizationTargetBLLcharacterizationTargetBLL = new CharacterizationTargetBLL();
            //声明并实例化县市区定性得分
            CityCharacterizationScoresBLLcityCharacterizationScoresBLL = new CityCharacterizationScoresBLL();
 
            //第一步获取所有受考核的定性指标名称表
            DataSet ds =characterizationTargetBLL.GetClassTargetName();
            DataTable dt = ds.Tables[0];
            var count = dt.Rows.Count;
            DataTable dtPart = new DataTable();
 
                           //拼表的表头的列名
           dtPart.Columns.Add("Name");
           dtPart.Columns.Add("ConditionInput");
           dtPart.Columns.Add("CalculateInput");
           dtPart.Columns.Add("Operate");
 
            //取出受考核的定性指标名称该表所有指标名字
            for (int i = 0; i < count; i++)
            {
                var Name =dt.Rows[i]["Name"].ToString();
 
 
                //第二步 通过循环 来拼表
 
                //调用方法来获取录入情况的boolean值
                Boolean fag =cityCharacterizationVotesBLL.GetNotInputCityBoolean(Name);
 
                //调用方法来获取计算情况的boolean值
                Boolean Calculate =cityCharacterizationScoresBLL.GetCityScoresBoolean(Name);
 
                //将记录添加到该列下
                DataRow dr = dtPart.NewRow();
                dr["Name"] = Name;
                dr["ConditionInput"]= fag ? "完成" : "未完成";
                dr["CalculateInput"]= Calculate ? "已计算" : "未计算";
                dr["Operate"] ="<a href=‘ScoresDetailsCityCharacterization.aspx?Name=" + Name +"‘ target=‘_blank‘>查看详情</a>";
                dtPart.Rows.Add(dr);
 
            }
            //将dtPart放到dataset中
            DataSet dsCadres = new DataSet();
            dsCadres.Tables.Add(dtPart);
            int n = dtPart.Rows.Count;
            string strJson =ToJson.Dataset2Json(dsCadres, n);//DataSet数据转化为Json数据
           context.Response.Write(strJson);//返回给前台页面
            context.Response.End();
 
        }

 

 

这便是我们所要实现的功能的核心代码所在,其它的代码我们在前面的文章中都已经有所提到,上面的代码便是我们的效果的具体实现。

 

 

总结


       我们这篇文章的核心是拼表,将不同的数据拼成一个新的DataTable,只不过我拼的比较特殊,这个表不仅包括来自数据库中的某列的数据、还包括我们根据来自数据库中的列的内容进行判断要显示的内容以及一个“查看详情”的跳转,这个相对来说比较麻烦,如果我们连这个都可以掌握的话,那么其它的拼表就更不在话下了。

 

项目总结—jQuery EasyUI-DataGrid 拼表及查看详情,布布扣,bubuko.com

项目总结—jQuery EasyUI-DataGrid 拼表及查看详情

上一篇:35+ 个免费下载的 HTML5/CSS3 下拉菜单(附下载地址)


下一篇:前端开发必知必会:CSS Position 全解析