easyUi的dataGrid动态改变列、列标题等

easyUi的dataGrid动态改变列、列标题等。

参考官方文档：http://www.jeasyui.net/tutorial/27.html，其中说明：“请记住，我们已经定义了其他属性，比如：url、width、height 等等。我们不需要再一次定义它们，我们定义那些我们需要改变的。”

实际代码：

function initList() {
    //初始化表格
    $('#matList').datagrid({
        height: 300,
        url: '', 
        idField: 'sID',
        striped: true,
        fitColumns: true,
        singleSelect: false,
        rownumbers: true,
        pagination: false,
        nowrap: false,
        showFooter: true,
        columns: [
            getColumns()
        ],
        toolbar: [
            {
                text: '选择项目',
                iconCls: 'icon-add',
                handler: handlerAdd
            }
            ,
            {
                text: '确认选择',
                iconCls: 'icon-edit',
                handler: handlerAccept
            },
            {
                text: "清空表格",
                iconCls: "icon-cancel",
                handler: function () { $('#matList').datagrid('loadData', { total: 0, rows: [] }); }
            }
        ],
        onBeforeLoad: function (param) {
        },
        onLoadSuccess: function (data) {
        },
        onLoadError: function () {
        },
        onClickCell: function (rowIndex, field, value) {
            onClickCell(rowIndex, field);
        }
    });
}
//列
function getColumns() {
    var cols =
    [
        { field: 'ID', title: '子项ID', width: 90, hidden: true },
        { field: 'sItemID', title: '商品编号', width: 90, hidden: true },
        { field: 'sItemIDName', title: '商品名称', width: 90, align: 'left' },
        { field: 'sUnit', title: '规格', width: 50, align: 'left' },
        { field: 'sUnitName', title: '单位', width: 50, align: 'left' },
        {   //仓库编号列，标题从业务类型中读取，数据来自数据集
            field: 'sStore', title: getStoreCaption(), width: 90, align: 'left',
            editor: {
                type: 'combobox',
                editable: false,
                options: {
                    valueField: 'sID',
                    textField: 'sName',
                    data: storeComboboxDatasource
                }
            },
            formatter: function (value, row, index) {
                for (var i = 0; i < storeComboboxDatasource.length; i++) {
                    if (storeComboboxDatasource[i].sID == value) {
                        return storeComboboxDatasource[i].sName;
                    }
                }
                return row["sStore"];
            }
        },
        {
            field: 'nCount', title: '数量', width: 50, align: 'left',
            editor: {
                type: 'numberbox',
                options: {
                    min: 0,
                    precision: 2
                }
            }
        },
        {
            field: 'nPrice', title: '单价', width: 50, align: 'right', editor: {
                type: 'numberbox',
                options: {
                    min: 0,
                    precision: 2
                }
            }
        },

        {
            field: 'nAgio', title: '优惠金额', width: 50, align: 'right', editor: {
                type: 'numberbox',
                options: {
                    min: 0,
                    precision: 2
                }
            }
        },
        { field: 'nMoney', title: '金额', width: 50, align: 'right' },
        {
            field: 'op', title: '操作', width: 80, align: 'left', formatter: function (value, row, index) {
                return "<a style='color:blue;cursor:pointer' onclick='javascript:removeMaterialRow(" + index + ");'>移除</a>";
            }
        }
    ];
    return cols;
}
function getStoreCaption() {
    var s = "";
    if (workTable != null) s = workTable.sStorerCaption;
    if (s == null || s == "") return "仓库";
    return s;
}