首页 > 代码库 > Extend ComboGrid Editors for DataGrid Of JQuery EasyUI
Extend ComboGrid Editors for DataGrid Of JQuery EasyUI
在JQueryEasyUI中为DataGrid自定义了一个ComboGrid编辑器。具体方法:自己写一个扩展$.extend($.fn.datagrid.defaults.editors, { combogrid: { init: function (container, options) { var input = $(‘<input type="text" class="datagrid-editable-input">‘).appendTo(container); input.combogrid(options); return input; }, destroy: function (target) { $(target).combogrid(‘destroy‘); }, getValue: function (target) { return $(target).combogrid(‘getValue‘); }, setValue: function (target, value) { $(target).combogrid(‘setValue‘, value); }, resize: function (target, width) { $(target).combogrid(‘resize‘, width); } }});定义DataGrid<table id="tt1" class="easyui-datagrid" singleselect="true" idfield="MaterialReceivedEntryID" fit="true" striped="true" rownumbers="true" fitcolumns="true" showfooter="true"> <thead> <tr> <th field="ItemID" width="80" formatter = "itemFormatter" editor="{ type: ‘combogrid‘, options: { required: true, panelWidth:260, fitColumns:true, idField:‘ItemID‘, textField:‘Code‘, url:‘<%= Html.AttributeEncode(Url.Action("GetRMItems", "Item")) %>‘, columns:[[ { field: ‘Code‘, title: ‘物料代码‘, width: 80 }, { field: ‘Material‘, title: ‘材质‘, width: 80, align: ‘center‘}, { field: ‘Diameter‘, title: ‘直径‘, width: 60, align: ‘center‘ } ]], onSelect:function(rowIndex, rowData) { $(‘#tt1‘).datagrid(‘updateRow‘, { index: _lastIndex, row: { Material: rowData.Material, Diameter: rowData.Diameter } }) } } }"> 原材料代码 </th> <th field="Material" width="80" align="center"> 材质 </th> <th field="Diameter" width="60" align="center"> 直径(mm) </th> <th field="Long" width="60" align="center" editor="{ type: ‘numberbox‘, options: { required: true}}"> 长度(mm) </th> <th field="ReceivedQty" width="60" align="center" editor="{ type: ‘numberbox‘, options: { required: true}}"> 根数(PCS) </th> <th field="Weight" width="60" align="center" editor="{ type: ‘numberbox‘, options: { required: true, precision: 3}}"> 重量(T) </th> <th field="HeatNumber" width="100" align="center" editor="{ type: ‘validatebox‘, options: { required: true}}"> 炉号 </th> <th field="Remark" width="80" align="center" editor="text"> 备注 </th> </tr> </thead></table>最后别忘了那个Formatterfunction itemFormatter(value, row) { ... ...}
Extend ComboGrid Editors for DataGrid Of JQuery EasyUI
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。