您的位置:首页 > Web前端 > 其它 > 正文

EasyUI DataGird动态生成列

更多 时间:2016-4-2 类别:Web前端 浏览量:1382

EasyUI DataGird动态生成列

EasyUI DataGird动态生成列

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

  •  
  •  
  •  
  • HTML 代码   复制
  • 
    <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>
    
    		
  •  

    标签:EasyUI