easyui 動態列實現

最近因公司需要，對easyui的動態列實現研究，并在網上查了不少的資料，但都不理想，結合自己的實踐，簡單介紹下實現過程；

需求特殊點在于：根據數據庫的動態表結構，動態的加載datagrid表格，因數據庫的表結構是變化的，用傳統的加載方式無法實現列隨表變化；正所謂難者不會，會者不難，而網上的相關資料比較少，經過大量的實驗，最終實現了功能，而且關鍵代碼卻非常簡單，如下所示：

      <script type="text/javascript">

        var dataGrid;

        var $datagrid = {};

        $datagrid.url = "${path }/******/dataGrid";

        $datagrid.striped = true;

        $datagrid.rownumbers = true;

        $datagrid.pagination = true;

        $datagrid.singleSelect = true;

        $datagrid.idField = "id";

        $datagrid.pageSize = 20;

        $datagrid.pageList = [ 10, 20, 30, 40, 50 ];

        //后臺動態請求列信息

        function findColumns() {

            $.post('${path }/*******/viewColumns', {

            }, function(data) {

                var columns = new Array();

                var arr = data;

                $.each(arr, function (i, item) {

                    columns.push({ "field": arr[i].colname, "title": arr[i].colalias, "width": 100 });

                });

                $datagrid.columns = new Array(columns);

                $('#dataGrid').datagrid($datagrid);

            }, 'JSON');

        }

</script>

通過以上方法，即可實現easyui的動態列展示，且頁面帶分頁功能；