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

 更新时间:2016年04月05日 14:03:55   投稿:mrr  
EasyUI中使用DataGird显示数据列表中,有时需要根据需要显示不同的列,例如,在权限管理中,不同的用户登录后只能查看自己权限范围内的列表字段,这就需要DataGird动态组合列,下面介绍EasyUI中DataGird动态生成列的方法

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动态生成列的方法,希望对大家有所帮助!

相关文章

  • 基于jQuery实现一个marquee无缝滚动的插件

    基于jQuery实现一个marquee无缝滚动的插件

    这篇文章主要介绍了基于jQuery实现一个marquee无缝滚动的插件,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-03-03
  • jquery 禁止鼠标右键并监听右键事件

    jquery 禁止鼠标右键并监听右键事件

    本篇文章主要介绍了jquery禁止鼠标右键并监听右键事件的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-04-04
  • jQuery中:header选择器用法实例

    jQuery中:header选择器用法实例

    这篇文章主要介绍了jQuery中:header选择器用法,以实例形式分析了:header选择器的功能、定义及匹配标题元素的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • JQuery在页面中添加和除移DOM示例代码

    JQuery在页面中添加和除移DOM示例代码

    本文为大家介绍下使用JQuery实现在页面中添加和除移DOM主要使用了以下几个方法,感兴趣的朋友可以了解下哈,希望对大家有所帮助
    2013-06-06
  • jQuery通过ajax请求php遍历json数组到table中的代码(推荐)

    jQuery通过ajax请求php遍历json数组到table中的代码(推荐)

    这篇文章主要介绍了jQuery通过ajax请求php遍历json数组到table中代码(推荐)的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • jquery实现回车键触发事件(实例讲解)

    jquery实现回车键触发事件(实例讲解)

    下面小编就为大家分享一篇jquery实现回车键触发事件的实例讲解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-11-11
  • 关于jQuery对象数据缓存Cache原理以及jQuery.data详解

    关于jQuery对象数据缓存Cache原理以及jQuery.data详解

    网上有很多教你怎么使用jQuery.data(..)来实现数据缓存,但有两个用户经常使用的data([key],[value])和jQuery.data(element,[key],[value])几乎没有什么文章说清楚它们两的区别,所以我用到了,研究下分享给大家。
    2013-04-04
  • 最新28个很棒的jQuery 教程

    最新28个很棒的jQuery 教程

    jQuery 是一个非常优秀的 JavaScript 框架,使用简单灵活,同时还有许多成熟的插件可供选择。今天的这篇文章收集了最新28个非常有用的 jQuery 教程分享给大家。
    2011-05-05
  • 浅析jQuery 3.0中的Data

    浅析jQuery 3.0中的Data

    jQuery 3.0 在6月9日正式发布了,3.0 也被称为下一代的 jQuery。这篇文章主要介绍了jQuery 3.0中的Data,包括Data在jQuery内部的使用和1.x.x 和 2.x.x 的比较的相关内容,需要的朋友可以参考下
    2016-06-06
  • jQuery控制输入框只能输入数值的小例子

    jQuery控制输入框只能输入数值的小例子

    jQuery控制输入框只能输入数值的小例子,需要的朋友可以参考一下
    2013-03-03

最新评论