easyui之datagrid动态修改列

easyui datagrid 定义列的方式通常是：

$('#grid').datagrid({columns:[[      {field:'f1',title:'字段1',width:160},      {field:'f2',title:'字段2',width:160}  ]]}); 

但在实际项目中，我们会经常需要datagrid能动态生成列。

在网上搜了一篇文章：再次谈谈easyui datagrid 的数据加载

很佩服这个作者，他居然能在easyui那一堆满是数字和字母组合的变量的被混淆的源码中，找到自己想要扩展的功能。。。强！

但是我不喜欢这种方式。毕竟修改源码有很多副作用，还是喜欢原生态。

动态生成列，这个很常见的需求，easyui不太可能不支持。

只是官方文档没有提到而已，可能作者是想靠这些高级功能赚咨询费。。。

说了很多废话，现在贴出我费了不少周折搞定的方法：

var options={};  $(function(){      var myNj = 9;      //初始化      $("#disgrid").datagrid({          type: 'POST',          nowrap: false,          striped: true,          fit:true,          width:1024,          height:500,          url:'',          pageSize:30,          remoteSort: false,          pagination:true,          rownumbers:true,          singleSelect:true,          queryParams:{              nj:myNj,              unitType:1          }      });             fetchData(myNj);  });    function fetchData(nj) {      var s = "";      s = "[[";      s = s + "{field:'unitname',title:'单元',width:160},{field:'practicetime',title:'测试时间',width:160},{field:'userid',title:'userid',width:120,hidden:'true'},{field:'serial',title:'serial',width:120,hidden:'true'},{field:'unitid',title:'unitid',width:100,hidden:'true'},";            //lu todo 列的定义可从服务器获得      if (nj==9) {          s = s + "{field:'aipanel_text_exam',title:'短文朗读',width:80},{field:'aipanel_scene_exam',title:'情景对话',width:80},{field:'aipanel_oral_exam',title:'简短说话',width:80}";            //lu 加一个计算列          s = s + ",{field:'tatal_score',title:'总分',width:60,formatter:function(value,rec){return paraseIntValue(rec.aipanel_text_exam)+paraseIntValue(rec.aipanel_scene_exam)+paraseIntValue(rec.aipanel_oral_exam);}}";      }else if (nj==7||nj==8){        //....    }      s = s + "]]";      options={};      options.url = '/app/search.do';      options.queryParams = {          nj:nj,          unitType:1      };      options.columns = eval(s);      //lu 增加一列      options.columns[0].push(          {              field:'desc',title:'查看详情',width:60,              formatter:function(value,rec){                  return "<a href=\"javascript:showDescInfo(\'"+rec.serial+"\',\'"+rec.scene_score+"\',\'"+rec.total_score+"\');\">详情</a>";              }          }         );            $('#disgrid').datagrid(options);      $('#disgrid').datagrid('reload');           }  

是不是觉得很简单？优雅的原生支持。。。

需要注意的是，列定义的JSON格式，很重要，不能错！如果格式不对，就不能正常工作。