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 相关文章推荐
javascript 有用的脚本函数
May 07 Javascript
ie7+背景透明文字不透明超级简单的实现方法
Jan 17 Javascript
javascript如何判断输入的url是否正确
Apr 11 Javascript
给应用部分的js代码设定一个统一的入口
Jun 15 Javascript
jQuery的position()方法详解
Jul 19 Javascript
Vue.js对象转换实例
Jun 07 Javascript
js注册时输入合法性验证方法
Oct 21 Javascript
vuejs实现本地数据的筛选分页功能思路详解
Nov 15 Javascript
Angular resolve基础用法详解
Oct 03 Javascript
AngularJs1.x自定义指令独立作用域的函数传入参数方法
Oct 09 Javascript
详解vue中async-await的使用误区
Dec 05 Javascript
Vue实现点击按钮复制文本内容的例子
Nov 09 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生成静态页面详解
2006/12/05 PHP
常用的php ADODB使用方法集锦
2008/03/25 PHP
PHP 高级课程笔记 面向对象
2009/06/21 PHP
linux下实现定时执行php脚本
2015/02/13 PHP
YII2框架中添加自定义模块的方法实例分析
2020/03/18 PHP
javascript数组使用调用方法汇总
2007/12/08 Javascript
如何让easyui gridview 宽度自适应窗口改变及fitColumns应用
2013/01/25 Javascript
JavaScript实现QueryString获取GET参数的方法
2013/07/02 Javascript
Jquery的hide及toggle方法让超链接慢慢消失
2013/09/06 Javascript
JQuery操作单选按钮以及复选按钮示例
2013/09/23 Javascript
同域jQuery(跨)iframe操作DOM(实例讲解)
2013/12/19 Javascript
AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
2014/06/06 Javascript
jquery中JSON的解析方式
2015/03/16 Javascript
JS使用JSON作为参数实例分析
2016/06/23 Javascript
JavaScript中获取时间的函数集
2016/08/16 Javascript
Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定示例
2017/01/22 Javascript
一次围绕setTimeout的前端面试经验分享
2017/06/15 Javascript
JSON在Javascript中的使用(eval和JSON.parse的区别)详细解析
2017/09/05 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
2020/08/06 Javascript
微信小程序:报错(in promise) MiniProgramError
2020/10/30 Javascript
[02:18]《我与DAC》之工作人员:为了热爱DOTA2的玩家们
2018/03/28 DOTA
python在命令行下使用google翻译(带语音)
2014/01/16 Python
[原创]使用豆瓣提供的国内pypi源
2017/07/02 Python
简单了解Java Netty Reactor三种线程模型
2020/04/26 Python
Python连接Mysql进行增删改查的示例代码
2020/08/03 Python
python 如何停止一个死循环的线程
2020/11/24 Python
Python3中对json格式数据的分析处理
2021/01/28 Python
CSS代码检查工具stylelint的使用方法详解
2021/03/27 HTML / CSS
医药学专业大学生职业生涯规划书论文
2014/01/21 职场文书
社团文化节策划书
2014/02/01 职场文书
户外婚礼策划方案
2014/02/08 职场文书
勤俭节约演讲稿
2014/05/08 职场文书
员工年度工作总结2015
2015/05/18 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
某药房的新员工入职告知书!
2019/07/15 职场文书
2019年农民幸福观调查的实践感悟
2019/12/19 职场文书