记录Datagrid使用的一些事项

1.将两个列的文本拼接到一起并显示，如列1为name，列2为code，需要显示name(code)。如：小明(123)

则初始化datagrid时在columns[]里加入：列1添加formatter方法，列2添加hidden:true。

{ field: 'CHNItemName', title: '名称', width: 350, sortable: false, align: 'left',
                        formatter: function (value, rec, index) {
                            return value + " (" + rec.BarCode + ')';
                        }
},
{ field: 'BarCode', title: 'BarCode', width: 100, sortable: false, align: 'left', editor: {type:'text',editable:false}, hidden:true }

 

2.在生成datagrid时将某列定义为可编辑状态或不可编辑，而不是在生成datagrid之后再控制编辑状态：将不可编辑的列的editor里写空(可编辑列的editor不为空)。

{ field: 'QTFYTEXT', title: '其他费用', width: 100, sortable: false, align: 'left', editor: {} }

在onLoadSuccess里对每一行执行beginEdit(开启编辑状态)。

onLoadSuccess: function (data) {

                            editIndex = $('#MyPurchaseOrder').datagrid('getRows').length - 1;
                            for(var i=editIndex;i>=0;i--)
                            {
                                $('#MyPurchaseOrder').datagrid('selectRow', i).datagrid('beginEdit', i);                                
                            }
}

 

3.控制datagrid中numberbox输入框可输入的最大值最小值：开始想通过直接设置numberbox的data-options属性的max/min，但html渲染完成后即使更改此属性也不生效。查阅资料后发现应在onBeforeEdit时设置列的editor.options.max，即可生效。

{ field: 'OrderQty', title: '数量', width: 90, sortable: false, align: 'left', editor: { type: 'numberbox', options: { precision: 3}} }

onBeforeEdit:function(rowIndex, rowData)
                        {
                            var columnOption = $('#MyPurchaseOrder').datagrid('getColumnOption',"OrderQty");
                            if(columnOption != null){
                                columnOption.editor.options.max = rowData.OrderQty;
                            }
                        }

 

 

　　

 

转载于:https://www.cnblogs.com/cwr-toki/p/10155769.html