记录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;
}
}

  

上一篇:C#一些不太熟悉的类——扩展学习


下一篇:html5/h5课件如何制作?