Jquery ui datagrid动态生成列

最近写一个方案，其中有一个需求是作一个通用的查询界面，根据后台返回的列名和对应的数据动态的构造列表，由于项目用的是基于jquery封装的一个前端框架，其中表格用的是jquery ui的datagrid，而jquery的datagrid列名只能是写死的，一开始想到的在初始化datagrid对象以前构造一个ajax请求来获取列名及数据，而后在初始化datagrid时传入从服务端获取到的列名的数组，相似于这样：

$.ajax() {

  success:fuction() {

columns = …..

resultGrid = $.datagrid(){

…

columns:columns

…

}

  }

}

 

但这种方式只能是获取第一页的数据，分页都不能用了，后来在网上找了一下，找到这篇文章：https://www.cnblogs.com/wpcnblog/p/5417123.html

大概思路就是扩展datagrid，增长一个createHeader的方法，在其中实现动态构造表格的逻揖，而这个逻揖基本上就是datagrid生成表的逻揖，能够直接从jquery.ui.js中去抄出来，但这篇文章中的代码我直接拷贝过来用后虽然能够动态生成列，但在调用datagrid的resize方法时老是报没有toLowerCase属性或方法的错误，致使表格中的数据的格式很是难看，跟踪调试后发现咱们项目的jquery.ui.js版本与这篇文章不同并且对它进行了一些修改，因此只能从咱们项目的jquery.ui.js中把构造表格的代码给抠出来了，但jquery.ui.js的代码不知什么缘由方法和变量都用下划线加数字了，致使可读性很是差，最后是经过<table关键字从代码中找出对应的构造表格的代码的。