easyui的可編輯表格并不具備回車事件。這讓edatagrid在結束編輯時的操作很麻煩,除非你點擊其他行,或者點出表格否則不會取消編輯行。
為了讓結束編輯操作更簡單些,我為每個單元格添加了回車事件,當回車時結束本行編輯,具體做法是重寫edatagrid的onDblClickCell事件,如下:
onDblClickCell : function(index, field, value) { if (opts.editing) { $(this).edatagrid('editRow', index); focusEditor(field); //以下是我添加的代碼 var currentEdatagrid = $(this); $('.datagrid-editable .textbox,.datagrid-editable .datagrid-editable-input,.datagrid-editable .textbox-text').bind('keydown', function(e){ var code = e.keyCode || e.which; if(code == 13){ $(currentEdatagrid).datagrid('acceptChanges'); $(currentEdatagrid).datagrid('endEdit', index); } }); //添加代碼結束 } if (opts.onDblClickCell) { opts.onDblClickCell.call(target, index, field,value); }},也可以單獨添加一個onEnterCell事件,在該事件中處理,靈活性更強。這樣就可以調用onEnterCell:function(index){}。
以上這篇easyui-edatagrid.js實現回車鍵結束編輯功能的實例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網。
新聞熱點
疑難解答