Question

我在Kendo UI Grid中寻找一些帮助，我有一个添加新记录的网格，取消更改按钮。当我点击添加新记录按钮时，我得到一个新行，我想在键盘上单击Enter时实现相同的功能。这是我的样本：

<div  id="tstCnfgnMsrGridDiv">
    <div data-role="grid" data-scrollable="true" data-editable="inline" data-resizable="true"
            data-toolbar="['create', 'cancel']"
            data-columns="[
                             { field: 'name'            , title: 'Name', width: 150},
                             { field: 'descr'       , title: 'Description', width: 150},
                             { field: 'createdDate'     , title: 'Created On', type : 'date', 'format' : '{0: MM/dd/yyyy HH:mm:ss}', 'width' : 100},
                             { field: 'createdByName'   , title: 'Created By', width: 100 },
                             { field: 'modifiedDate'    , title: 'Modified On', type : 'date', 'format' : '{0: MM/dd/yyyy HH:mm:ss}', 'width' : 100}
                             { field: 'modifiedByName'  , title: 'Modified By', width: 100},


                         ]"
            data-bind="source: empDataSource, events : {edit : editGrid}"
            data-scrollable='true' 
            data-sortable='true' 
            data-filterable='true'
            data-pageable="{ 
                             pageSize: 15,
                             pageSizes: [15, 50, 100, 200, 500],
                             refresh : true,                                                         
                             buttonCount : 5
                             }"
            style="width: 100%; height: 650px">
    </div>
</div>
<div id="tstCnfgnMsrGridSubDiv"></div>
<script type="text/javascript" src="../resources/js/coreCnfgn/measure.js"></script>
<script>



   $(document).ready(function() {
       var tooltip = $("#tstCnfgnMsrGridDiv").kendoTooltip({
           filter: "th",
           width: 120,
           position: "bottom"
       }).data("kendoTooltip");

       $("#tstCnfgnMsrGridDiv").find("th").click(false);

       **$(document.body).keydown(function(e) {
           if (e.altKey && e.keyCode == 13) {

               $("#tstCnfgnMsrGridDiv").addRow();
           }
       });**
   });
</script>

当我选中kendo.all.min.js创建 - create:{text:"Add new record",imageClass:"k-add",className:"k-grid-add",iconClass:"k-icon"}

时

k-grid-add类有addRow方法，我尝试在我的html页面中调用相同的方法，但它不起作用。

有人可以帮我解决这个问题吗。

谢谢...

Answer 1

可悲的是，因为kendo网格甚至在表的任何子节点上都接管了ENTER，所以我无法注册事件来执行逻辑。

如果你看一下kendo.all并搜索

case keys.ENTER:
                        e.preventDefault();
                        if (isCell) {
                            if (that.options.editable && that.options.editable.update !== false) {
                                that._cachedCurrent = that.current;
                                that.list._startEditHandler(that.current);
                                $(this).one('keyup', function (e) {
                                    e.stopPropagation();
                                });
                            }
                        } else {
                            that.current.children('a.k-link').click();
                        }
                        break;

如果您愿意，您可以随时更改该来源，但我个人不会。

如何在Kendo UI Grid中单击Enter时添加新行

1 个答案: