Jquery 更新字段数据后的剑道网格MVVM内联编辑焦点问题

我们正在尝试创建剑道网格，所有字段都处于行内编辑模式。当“编辑字段”选项卡更改不移动到下一个控件时，我们面临一个问题

重复发布的步骤：

编辑第一个单元格中的文本 单击tab键 从网格中丢失焦点。 请帮忙解决

JS:

HTML

剑道网格的属性打开网格的键盘导航。我的示例演示如何使用此属性。通常，定义网格时，每个单元格都将其定义为仅显示元素，当用户在该单元格上单击/制表符时，Kendo将动态显示输入元素

var grid = $("#grid").kendoGrid({
    dataSource: ds,
    navigatable: true,
    pageable: true,
    sortable: true,
    resizable: true,
    reorderable: true,
    editable: true,
    columns: [{
        field: "FirstName",
        width: 90,
        title: "First Name"
    }, {
        field: "LastName",
        width: 200,
        title: "Last Name"
    }, {
        field: "City",
        width: 200
    }]
}).data("kendoGrid");

<div id="people">
    <div data-role="grid" data-bind="source: roles" data-row-template="role-template" data-columns='[{"field": "firstName", "title": "First Name"}, 
                        {"field": "lastName", "title": "Last Name"}, 
{"field": "username", "title": "user name"}]'></div>
</div>
<script type="text/x-kendo-template" id="role-template">
    < tr class = "k-grid-edit-row" > < td > < input type = "text"
    class = "k-textbox"
    data - bind = "value:firstname" / > < /td>
    <td>
        <input type="text"  class="k-textbox"  data-bind="value:lastname"/ > < /td>
    <td>
      <input type="text"  class="k-textbox"  data-bind="value:username"/ > < /td>

    </tr >

var grid = $("#grid").kendoGrid({
    dataSource: ds,
    navigatable: true,
    pageable: true,
    sortable: true,
    resizable: true,
    reorderable: true,
    editable: true,
    columns: [{
        field: "FirstName",
        width: 90,
        title: "First Name"
    }, {
        field: "LastName",
        width: 200,
        title: "Last Name"
    }, {
        field: "City",
        width: 200
    }]
}).data("kendoGrid");