EasyUI 动态改变数据窗口列 Dynamic Change DataGrid Coiumns

 数据表格列可以通过’columns’属性轻松定义。如果要动态改变列也没有问题。

要改变列，可以再次调用数据表格方法并传递一个新的columns属性。

下面我们定义了一个数据表格组件:

<table id="tt"></table>

        $('#tt').datagrid({      

                  title:'Change Columns',      iconCls:'icon-save',      width:550,      height:250,    url:'datagrid_data.json',      

                columns:[[          

                       {field:'itemid',title:'Item ID',width:80},         

                      {field:'productid',title:'Product ID',width:80},                                                                             {field:'attr1',title:'Attribute',width:200},          {field:'status',title:'Status',width:80}      

                             ]]

                });
 

如果要更改columns显示，则重新传递一个新的columns属性。

 $('#tt').datagrid({      

                columns:[[          

                    {field:'itemid',title:'Item ID',width:80},          

                    {field:'productid',title:'Product ID',width:80},          

                    {field:'listprice',title:'List Price',width:80,align:'right'},          

                    {field:'unitcost',title:'Unit Cost',width:80,align:'right'},          {field:'attr1',title:'Attribute',width:100},          {field:'status',title:'Status',width:60}      

                          ]]  

                   });
 

 

我们已经定义了其它属性，如url，width，height等。我们不需要再次定义，我们仅需要定义要修改的即可。