jQuery EasyUI中DataGird动态生成列的方法


Posted in Javascript onApril 05, 2016

EasyUI中使用DataGird显示数据列表中,有时需要根据需要显示不同的列,例如,在权限管理中,不同的用户登录后只能查看自己权限范围内的列表字段,这就需要DataGird动态组合列,下面介绍EasyUI中DataGird动态生成列的方法。

DataGird动态生成列,实际上就是控制DataGird的 columns 属性值,下面通过ajax异步调用后台columns的数据,进行绑定。

<table id="dg"></table>
<script>
function easyUIDataGrid(medid) {
var $datagrid = {};
var columns = new Array();
$datagrid.title = "";
$datagrid.height = $(window).height() - 31;
$datagrid.width = $(window).width();
$datagrid.sortName = "dt";
$datagrid.sortOrder = "desc";
$datagrid.idField = "id";
var param = { "medid": medid };
$.ajax({
url: 'getCol.page',
type: 'post',
data: "medid=" + medid,
dataType: "json",
async: false,
success: function (returnValue) {





//异步获取要动态生成的列 别名,宽度也可以
var arr = returnValue;
$.each(arr, function (i, item) {
columns.push({ "field": item.colname, "title": item.colalias, "width": 100, "sortable": true });
});
$datagrid.columns = new Array(columns);
$('#dg').datagrid($datagrid);
}
});
}
</script>

以上所述是小编给大家介绍的jQuery EasyUI中DataGird动态生成列的方法,希望对大家有所帮助!

Javascript 相关文章推荐
DOM精简教程
Oct 03 Javascript
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)
Apr 01 Javascript
Extjs4 类的定义和扩展实例
Jun 28 Javascript
JavaScript中Number对象的toFixed() 方法详解
Sep 02 Javascript
获取select的value、text值的简单示例(jquery与javascript)
Dec 07 Javascript
AngularJS报错$apply already in progress的解决方法分析
Jan 30 Javascript
vue使用ajax获取后台数据进行显示的示例
Aug 09 Javascript
mpvue将vue项目转换为小程序
Sep 30 Javascript
layer.open提交子页面的form和layedit文本编辑内容的方法
Sep 27 Javascript
JavaScript数组排序小程序实现解析
Jan 13 Javascript
原生JavaScript之es6中Class的用法分析
Feb 23 Javascript
Openlayers实现距离面积测量
Sep 28 Javascript
基于jquery fly插件实现加入购物车抛物线动画效果
Apr 05 #Javascript
JS简单编号生成器实现方法(附demo源码下载)
Apr 05 #Javascript
JS基于ocanvas插件实现的简单画板效果代码(附demo源码下载)
Apr 05 #Javascript
JavaScript图像延迟加载库Echo.js
Apr 05 #Javascript
超漂亮的Bootstrap 富文本编辑器summernote
Apr 05 #Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
Apr 05 #Javascript
JS+CSS实现闪烁字体效果代码
Apr 05 #Javascript
You might like
实例讲解php数据访问
2016/05/09 PHP
php redis实现对200w用户的即时推送
2017/03/04 PHP
详解php语言最牛掰的Laravel框架
2017/11/20 PHP
不同浏览器对回车提交表单的处理办法
2010/02/13 Javascript
通过pjax实现无刷新翻页(兼容新版jquery)
2014/01/31 Javascript
Js的Array数组对象详解
2016/02/22 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
Node.js中环境变量process.env的一些事详解
2017/10/26 Javascript
bootstrap3中container与container_fluid外层容器的区别讲解
2017/12/04 Javascript
Vuex中的State使用介绍
2019/01/19 Javascript
Vue.js轮播图走马灯代码实例(全)
2019/05/08 Javascript
[08:42]DOTA2每周TOP10 精彩击杀集锦vol.2
2014/06/25 DOTA
[01:20]2018DOTA2亚洲邀请赛总决赛战队Mineski晋级之路
2018/04/07 DOTA
Python 错误和异常小结
2013/10/09 Python
详解JavaScript编程中的window与window.screen对象
2015/10/26 Python
python万年历实现代码 含运行结果
2017/05/20 Python
基于python的字节编译详解
2017/09/20 Python
Python使用Matplotlib模块时坐标轴标题中文及各种特殊符号显示方法
2018/05/04 Python
python中单下划线_的常见用法总结
2018/07/10 Python
padas 生成excel 增加sheet表的实例
2018/12/11 Python
Python修改文件往指定行插入内容的实例
2019/01/30 Python
使用GitHub和Python实现持续部署的方法
2019/05/09 Python
浅谈python图片处理Image和skimage的区别
2019/08/04 Python
Pytorch实现LSTM和GRU示例
2020/01/14 Python
pycharm专业版远程登录服务器的详细教程
2020/09/15 Python
Html5 滚动穿透的方法
2019/05/13 HTML / CSS
Eyeko美国:屡获殊荣的睫毛膏、眼线笔和眉妆
2018/07/05 全球购物
防灾减灾日活动总结
2014/08/26 职场文书
小学运动会加油词
2015/07/18 职场文书
2015年音乐教研组工作总结
2015/07/22 职场文书
聘任合同书
2015/09/21 职场文书
如何判断pytorch是否支持GPU加速
2021/06/01 Python
Python如何识别银行卡卡号?
2021/06/10 Python
详解Python类和对象内容
2021/06/22 Python
Nginx的gzip相关介绍
2022/05/11 Servers
MySQL中JOIN连接的基本用法实例
2022/06/05 MySQL