`

easyui 数据表格datagrid动态列代码

阅读更多

$('#searchForm').form("submit", {
  url : WINDOW_CONTEXT_PATH+'/data/roleList.action',
  dataType:'json',
  success : function(data) {
   var result = $.parseJSON(data);
   if (result.success) {
    var columns=new Array();
          var cls=result.rows.columns;
          for(var i=0;i<cls.length;i++){
           var column={}; 
              column["title"]=cls[i].title; 
              column["field"]=cls[i].field; 
              column["width"]=100;
              column["align"]='center';
              columns.push(column);
    };
          grid = $('#grid').datagrid({
              idField : 'roleId',
     striped : false,
     rownumbers : true,
     pagination : true,
     singleSelect : false,
     pageSize : 10,
     pageList: [10, 20],

     fitColumns: true,
     striped:true,
     toolbar:"#toolbar",
     frozenColumns : [[{
      title : '角色ID',
      field : 'roleId',
      width : 100,
      sortable:true
     }]],
              columns : [ 
                  columns 
              ], 
              rownumbers:true}).datagrid('loadData',result.rows.rows).datagrid('clearSelections'); 
   } else {
    $.messager.alert('提示', result.error.msg, 'error');
   }
  }   
 });

分享到:
评论

相关推荐

    EasyUI 数据表格datagrid列自适应内容宽度的实现

    主要介绍了EasyUI 数据表格datagrid列自适应内容宽度的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    easyUI-datagrid数据表格导出功能后台代码

    项目工具代码,中间包含了service和controller两层,model可以自己定义

    EasyUI的DataGrid每行数据添加操作按钮的实现代码

    今天做项目的时候,想在easyui的datagrid每一列数据后边都加上一个操作按钮,怎么实现此功能呢?下面小编给大家带来了EasyUI的DataGrid每行数据添加操作按钮的实现代码,需要的朋友参考下吧

    EasyUI的DataGrid绑定Json数据源的示例代码

    EasyUI给表格绑定数据是最常用的方法,小编分享一下总结出来的两种绑定表格方法,知识在于积累。 第一种:数据存放在数据集中,每一行对应多个值,利用循环把数据绑定到表格 前台代码: &lt;table id="dg" class...

    EasyUI DataGrid及Pagination(源码)

    介绍EasyUI的DataGrid数据表格以及Pagination分页 按照说明可直接运行代码. .

    Easyui Datagrid自定义按钮列(最后面的操作列)

    做项目的时候因为需求,要在表格的最后添加一列操作列,easyUI貌似没有提供这种功能,下面我们来自定义按钮列,具体实现代码,大家参考下本文吧

    jQuery EasyUI API 中文文档 – DataGrid数据表格

    依赖 panel resizable linkbutton pagination 用法 代码如下: ”tt”&gt;&lt;/table&gt; 代码如下: $(‘#tt’).datagrid({ url:’datagrid_data.json’, columns:[[ {field:’code’,title:’Code’,width:100}, {field:’...

    EasyUi datagrid 实现表格分页

    1.首先引入 easyui的 css 和 js 文件 2.前台 需要写的js 代码如下: //源数据 function Async(action,args,callback){  $.ajax({  url: action ,  type:”POST”,  dataType:”json”,  timeout: 10000,  data...

    使用Easyui实现查询条件的后端传递并自动刷新表格的两种方法

    通过datagrid的load方法直接传递参数并自动刷新表格 通过ajax的post函数传递参数并通过loadData方法将数据初始化到表格中 js代码(搜索按钮的点击事件部分): $(#standardQueryBtn).click(function(){//点击搜索...

    jQuery Easyui学习教程之实现datagrid在没有数据时显示相关提示内容

    本示例实现easyui datagrid加载/查询数据时,如果没有相关记录,则在datagrid中显示没有相关记录的提示信息,效果如下图所示  本实例要实现如下图所示的效果:  本示例easyui版本为1.3.4,如果运行后没有效果,...

    jquery EasyUI的formatter格式化函数代码

    要格式化数据表格列,需要设置formatter属性,该属性是一个函数,它包含两个参数: value: 对应字段的当前列的值 record: 当前行的记录数据 代码如下: $(‘#tt’).datagrid({ title:’Formatting Columns’, width:...

    EasyUI学习之DataGird分页显示数据

    本文实例为大家分享了EasyUI DataGird的使用方法,供大家参考,具体内容如下 1. html代码 xss=removed title=用户操作 data-options=iconCls:&gt; ...// 初始化Datagrid表格数据 }); // 实现对DataGird控件的绑

    springmvcdemo

    表格:jqueryeasyui datagrid 代码树:ztree 后台需要用的技术 1. 解析xml:dom4j.jar 2. 解析json:json-lib.jar 3 URL Mapping: ControllerClassNameHandlerMapping 映射控制器 4 使用MultiActionController 5 ...

    GoodProject Maven Webapp.zip

    jQuery EasyUI 提供了用于创建跨浏览器网页的完整的组件集合,包括功能强大的 datagrid(数据网格)、treegrid(树形表格)、 panel(面板)、combo(下拉组合)等等。 用户可以组合使用这些组件,也可以单独使用其中一个。 ...

Global site tag (gtag.js) - Google Analytics