Jquery datagrid动态添加列

2024-06-03 00:38

本文主要是介绍Jquery datagrid动态添加列,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

后端

        /// <summary>/// SpecificQjValue(格式:1,2) 改为 1 as SpecificQjValue0,2 as SpecificQjValue1格式/// </summary>/// <param name="SpecificQjValue"></param>/// <returns></returns>public string GetQjValue(string SpecificQjValue){int i = 0;string strQjValue = string.Empty;SpecificQjValue.Split(',').ToList().ForEach(x =>{strQjValue = (string.IsNullOrEmpty(strQjValue)) ? x + " as SpecificQjValue" + i : strQjValue + "," + x + " as SpecificQjValue" + i;i++;});return strQjValue;}///获取详情public JsonModelInfoList<JsonSampleAcceptQjMxInfo> GetSampleAccepQjMxInfo(int Id){string sql = string.Empty;List<JsonSampleAcceptQjMxInfo> rowQj = DapperHelper.Select<JsonSampleAcceptQjMxInfo>(TargetDB.Target,"select * from SampleAcceptQjMxInfo where SampleAcceptQjId = " + Id, null);rowQj.ForEach(x =>{string strQjValue = GetQjValue(x.SpecificQjValue);string sql1 = "select  m.CreateTime,m.BatchNum,m.VolumeNum,m.ResultOk, " + strQjValue +",(select MakeName from SampleAcceptQjInfo where Id = m.SampleAcceptQjId ) as MakeName," +"(select AdmitName from SampleAcceptQjInfo where Id = m.SampleAcceptQjId ) as AdmitName," +"stuff((select ','+ SpecQjColName from SpecificQjInfo t where SpecificMxId = m.SpecificMxId order by Id  for  xml path('')), 1, 1, '') as SpecQjColNamefrom SampleAcceptQjMxInfo m where m.Id = " + x.Id;sql = (string.IsNullOrEmpty(sql)) ? sql1 : sql + " union all " + sql1;});List<JsonSampleAcceptQjMxInfo> rows = DapperHelper.Select<JsonSampleAcceptQjMxInfo>(TargetDB.Target, sql, null);// 总数int total = rows.Count;List<JsonSampleAcceptQjMxInfo> temp = rows;return new JsonModelInfoList<JsonSampleAcceptQjMxInfo> { total = total, rows = rows};}

原先查询结果
在这里插入图片描述
以上后端代码运行后最终查询结果:SpecificQjValue可以为多个 不固定 动态的
在这里插入图片描述一般处理程序

  public void GetSampleAccepQjMxInfo(){int Id = Convert.ToInt32(Context.Request["Id"].Trim());//int pageSize = Convert.ToInt32(Context.Request["rows"].ToString());//int pageIndex = Convert.ToInt32(Context.Request["page"].ToString());JsonModelInfoList<JsonSampleAcceptQjMxInfo> datasource = bll.GetSampleAccepQjMxInfo(Id);int i = 0;int colCount = 6 + datasource.rows[0].SpecQjColName.Split(',').Length;//固定列+动态列string jsonCol = ",\"totalCol\":"+ colCount + ",\"columns\":[{\"field\":\"CreateTime\",\"title\":\"检查日期\"},      {\"field\":\"BatchNum\",\"title\":\"批号\"},{\"field\":\"VolumeNum\",\"title\":\"卷号\"}";datasource.rows[0].SpecQjColName.Split(',').ToList().ForEach(x =>{jsonCol += ",{\"field\":\"SpecificQjValue"+i+"\",\"title\":\"" + x + "\"}";i++;});jsonCol += ",{\"field\":\"ResultOk\",\"title\":\"判定\"},{\"field\":\"MakeName\",\"title\":\"检查员\"},{\"field\":\"AdmitName\",\"title\":\"承认\"}]}";string jsonRow = JsonConvert.SerializeObject(datasource);string json = jsonRow.Substring(0, jsonRow.Length - 1) + jsonCol;Context.Response.ContentType = "json";Context.Response.Write(json);}

前端获取的Json格式:

{
"total":1,
"rows":[{"Id":6,"QjNo":"1","TicketName":"666666PC","ManageProject":"1"},{"Id":7,"QjNo":"777","TicketName":"77777PC","ManageProject":"7"}],
"totalCol":1,
"columns":[{"field":"1111","title":"1111"},{"field":"2222","title":"2222"}]
}
$(function () {
$.ajax({type: "post", url: '',data: { Id: $("#hidID").val() },dataType: "json", async: false,cache: false,error: function (x, e) {return true;},success: function (data) if (data.total > 0) {var successData={total:data.total,rows:data.rows};var arrays = [];var columnsArray = [];for (var i = 0; i < data.totalCol; i++) { arrays.push({ field: '', title: '', width: '' }); }columnsArray.push(arrays);//[[]]形式  $(data.columns).each(function(index,value){ columnsArray[0][index]['field'] = value.field;columnsArray[0][index]['title'] = value.title;columnsArray[0][index]['width'] = "100";  });//赋值      $('#mygrid').datagrid({  columns:columnsArray,  data: successData  });  }      }});})

这篇关于Jquery datagrid动态添加列的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1025553

相关文章

全面解析HTML5中Checkbox标签

《全面解析HTML5中Checkbox标签》Checkbox是HTML5中非常重要的表单元素之一,通过合理使用其属性和样式自定义方法,可以为用户提供丰富多样的交互体验,这篇文章给大家介绍HTML5中C... 在html5中,Checkbox(复选框)是一种常用的表单元素,允许用户在一组选项中选择多个项目。本

HTML5 搜索框Search Box详解

《HTML5搜索框SearchBox详解》HTML5的搜索框是一个强大的工具,能够有效提升用户体验,通过结合自动补全功能和适当的样式,可以创建出既美观又实用的搜索界面,这篇文章给大家介绍HTML5... html5 搜索框(Search Box)详解搜索框是一个用于输入查询内容的控件,通常用于网站或应用程

CSS3中的字体及相关属性详解

《CSS3中的字体及相关属性详解》:本文主要介绍了CSS3中的字体及相关属性,详细内容请阅读本文,希望能对你有所帮助... 字体网页字体的三个来源:用户机器上安装的字体,放心使用。保存在第三方网站上的字体,例如Typekit和Google,可以link标签链接到你的页面上。保存在你自己Web服务器上的字

html 滚动条滚动过快会留下边框线的解决方案

《html滚动条滚动过快会留下边框线的解决方案》:本文主要介绍了html滚动条滚动过快会留下边框线的解决方案,解决方法很简单,详细内容请阅读本文,希望能对你有所帮助... 滚动条滚动过快时,会留下边框线但其实大部分时候是这样的,没有多出边框线的滚动条滚动过快时留下边框线的问题通常与滚动条样式和滚动行

Java调用C#动态库的三种方法详解

《Java调用C#动态库的三种方法详解》在这个多语言编程的时代,Java和C#就像两位才华横溢的舞者,各自在不同的舞台上展现着独特的魅力,然而,当它们携手合作时,又会碰撞出怎样绚丽的火花呢?今天,我们... 目录方法1:C++/CLI搭建桥梁——Java ↔ C# 的“翻译官”步骤1:创建C#类库(.NET

MyBatis编写嵌套子查询的动态SQL实践详解

《MyBatis编写嵌套子查询的动态SQL实践详解》在Java生态中,MyBatis作为一款优秀的ORM框架,广泛应用于数据库操作,本文将深入探讨如何在MyBatis中编写嵌套子查询的动态SQL,并结... 目录一、Myhttp://www.chinasem.cnBATis动态SQL的核心优势1. 灵活性与可

使用vscode搭建pywebview集成vue项目实践

《使用vscode搭建pywebview集成vue项目实践》:本文主要介绍使用vscode搭建pywebview集成vue项目实践,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地... 目录环境准备项目源码下载项目说明调试与生成可执行文件核心代码说明总结本节我们使用pythonpywebv

Mybatis嵌套子查询动态SQL编写实践

《Mybatis嵌套子查询动态SQL编写实践》:本文主要介绍Mybatis嵌套子查询动态SQL编写方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录前言一、实体类1、主类2、子类二、Mapper三、XML四、详解总结前言MyBATis的xml文件编写动态SQL

使用Python和Tkinter实现html标签去除工具

《使用Python和Tkinter实现html标签去除工具》本文介绍用Python和Tkinter开发的HTML标签去除工具,支持去除HTML标签、转义实体并输出纯文本,提供图形界面操作及复制功能,需... 目录html 标签去除工具功能介绍创作过程1. 技术选型2. 核心实现逻辑3. 用户体验增强如何运行

SpringBoot实现Kafka动态反序列化的完整代码

《SpringBoot实现Kafka动态反序列化的完整代码》在分布式系统中,Kafka作为高吞吐量的消息队列,常常需要处理来自不同主题(Topic)的异构数据,不同的业务场景可能要求对同一消费者组内的... 目录引言一、问题背景1.1 动态反序列化的需求1.2 常见问题二、动态反序列化的核心方案2.1 ht