datagrid的初始化以及动态加载

//datagrid初始化 
$(function() {
    $('#tt').datagrid({
    //title : '信息显示',
    //iconCls : 'icon-save',
    width : 'auto',
    height : 'auto',
    pageSize:5,
    pageList : [ 5, 10, 15 ],
    nowrap : true,
    striped : true,
    //fitColumns: true,
    collapsible : true,
    url : 'elq.action',
    loadMsg : '数据装载中......',
    onLoadError : function() {
        alert('数据加载失败!');
    },
    //sortName : 'code',
    sortOrder : 'desc',
    remoteSort : false,
    frozenColumns : [ [ {
        field : 'ck',
        checkbox : true
    } ] ],
    columns : [ [ {
        title : '题型号',
        field : 'questionId',
        width : '100',
        rowspan : 3,
        align : 'center',
        //添加超级链
        formatter:function(value,rowData,rowIndex){
            //function里面的三个参数代表当前字段值，当前行数据对象，行号（行号从0开始）
            //alert(rowData.typeCode);通过这个可以得到所有字段的数据，如typeCOde,teacherId等 
            return ""+value+"";
       }
    }, {
        title : '题型代码',
        field : 'typeCode',
        width : '100',
        rowspan : 3,
        align : 'center'
    }, {
        title : '导入时间',
        field : 'addTime',
        width : '200',
        rowspan : 3,
        align : 'center',
        formatter:function(val,rec){
 //调用时间格式转换方法
 return formattime(val);
  }
    }, {
        title : '管理员',
        field : 'teacherId',
        width : '100',
        rowspan : 3,
        align : 'center'
    }, {
        title : '使用次数',
        field : 'useNumber',
        width : '100',
        rowspan : 3,
        align : 'center'
    }, {
        title : '状态',
        field : 'status',
        width : '100',
        rowspan : 3,
        align : 'center'
    }
     ] ],
    toolbar: [{
         text: '添加', 
         iconCls: 'icon-add', 
         handler: function() { 
             openDialog("add_dialog","add"); 
         } 
     }, '-', {
         text: '修改', 
         iconCls: 'icon-edit', 
         handler: function() { 
             openDialog("add_dialog","edit"); 
         } 
     }, '-',{ 
         text: '删除', 
         iconCls: 'icon-remove', 
         handler: function(){ 
             del(); 
         } 
     }],
    pagination : true,
    rownumbers : true
 });
 displayMsg();
});

//分页显示块
function displayMsg() {
    $('#tt').datagrid('getPager').pagination({
       displayMsg : '当前显示从{from}到{to}共{total}记录'
    });
}

 

 

上面是初始化datagrid，然后就可以进行动态加载了

 

 

下面是EasyUI   的datagrid动态加载数据，

  是通过combox的change时间触发，动态加载数据

 

$(function() {
 //动态加载题库
 $('#state').combobox({
     onChange:function(newValue,oldValue){
      //根据不同的请求加载不同的题库
      if(newValue=="EL"){
       $('#tt').datagrid({
        url : 'elq.action',
        loadMsg : '数据装载中......',
        onLoadError : function() {
           alert('数据加载失败!');
        }
       });
      }else if(newValue=="ER"){
       $('#tt').datagrid({
        url : 'erq.action',
        loadMsg : '数据装载中......',
        onLoadError : function() {
           alert('数据加载失败!');
        }
       });
      }else if(newValue=="EO"){
       $('#tt').datagrid({
        url : 'eoq.action',
        loadMsg : '数据装载中......',
        onLoadError : function() {
           alert('数据加载失败!');
        }
       });
      }else if(newValue=="EW"){
       $('#tt').datagrid({
        url : 'ewq.action',
        loadMsg : '数据装载中......',
        onLoadError : function() {
           alert('数据加载失败!');
        }
       });
      }else if(newValue=="EY"){
       $('#tt').datagrid({
        url : 'eyq.action',
        loadMsg : '数据装载中......',
        onLoadError : function() {
           alert('数据加载失败!');
        }
       });
      }else {
       alert("错误！");
       return;
      }
     } 
 });
});