脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-jQuery Easyui datagrid动态列绑定，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

前几天有人在使用jQuery EasyUI的datagrid时，遇到不会动态绑定列的情况，而网上给出的例子可能也是比较早的处理办法，竟然需要修改easyui源码，其实解决这问题的思路是很简单，我们只需修改要显示的列即可。那位朋友最后改为这种处理时，发现还是有问题，最终我发现她返回不是合法json，里边多个方括号，这里推荐大家使用本站的JSON在线校验格式化工具来验证返回json是否正确。

这里我们以上篇文章中类似的简单json来说明这个问题，比如后台要根据当前用户的权限返回不同的json：

分享一个最好用的UI前端框架！

.代码

1. public ActionResult getstudents(int level＝0)
2. {
3. List list = new List();
4. list.Add(new Student() { id = 1, name = "小李" });
5. list.Add(new Student() { id = 2, name = "小王" });
7. //级别是老师，则可查看学生地址
8. if (level == 1)
9. {
10. list = new List();
11. list.Add(new Student() { id = 1, name = "小李", address = "北京" });
12. list.Add(new Student() { id = 2, name = "小王", address = "上海" });
13. }
15. return Json(list, JsonRequestBehavior.AllowGet);
16. }

    那么使用easyui datagrid时，页面上有：

    .代码

    

    1. 如果你在table上使用了class="easyui-datagrid"那么你会发现ajax请求了两次，具体查看办法可看看chrome下ajax请求结果。

       默认显示列调用：

       .代码

       

       1. $(function () {
       2. $('#tt').datagrid({
       3. url: '/home/getstudents',
       4. columns: [[
       5. { field: 'id', tITle: '学生ID', width: 80 },
       6. { field: 'name', title: '姓名', width: 120 }
       7. ]]
       8. });
       9. });

          显示结果如下：

          

          那么当老师级别查看的时候，只需要修改下columns即可，后台json返回要加上address列。当然这里的权限我们作为演示是传过去的，真正项目中肯定是要在后台判断的。 分享一个最好用的UI前端框架！

          .代码

          

          1. $('#tt').datagrid('options').url = '/home/getstudents?level=1';
          2. $('#tt').datagrid({
          3. columns: [[
          4. { field: 'id', title: '学生ID', width: 80 },
          5. { field: 'name', title: '姓名', width: 120 },
          6. { field: 'address', title: '地址', width: 120 }
          7. ]]
          8. });

             结果如下：

             

             到这我们本篇所提到的问题已得到解决，其实解决思路还是来自easyui的官网，但很多人都没有这个习惯，出了问题不会主动去看官网的说明。当然也有不少朋友都访问不了官网，我这几天发现GOOGLE的jquery cdn也不稳定，迫使本人开始使用新浪的jQuery cdn。

             觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

             脚本宝典总结

             以上是脚本宝典为你收集整理的javascript代码实例教程-jQuery Easyui datagrid动态列绑定全部内容，希望文章能够帮你解决javascript代码实例教程-jQuery Easyui datagrid动态列绑定所遇到的问题。

             如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

             本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
             如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。