kendogrid选定单元格

时间:2017-09-11 10:02:03

标签: javascript model-view-controller kendo-grid

我有一个带有1个可编辑列的kendo网格,当我执行某个javascript函数时,我想启用当前所选单元格的编辑。关键是这是以编程方式发生的,而不是通过单击单元格。代码当前所做的是选择需要设置为编辑模式的单元格,但不启用编辑模式本身。

修改(修复):

我必须将索引更改为单元格选择为+1,而行选择保持不变(可能是因为标题计为单元格或其他内容)。还有一些功能可以从编辑领域中消除焦点,立即关闭它。

JS:

$('#txtBarcode').keydown(function (e) {
    var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
    if (key == 13) {

        var grid = $("#PickListDetailGrid").data("kendoGrid");
        var dataSource = $("#PickListDetailGrid").data("kendoGrid").dataSource;
        var allData = dataSource.data();
        var code = this.value;

        $.each(allData, function (index, item) {
            if (item.ArticleID == code) {
                console.log("index :" + index);                    
                var cell = grid.select("tr:eq(" + index + ") td:eq(" + (5) + ")");
                grid.editCell(cell); 
            }
        })
    }
});

网格:

    @(Html.Kendo().Grid<TelerikMvcApp1.Models.PickListLineViewModel>()
                        .Name("PickListDetailGrid")
                        .Columns(columns =>
                        {
                            columns.Bound(c => c.ArticleName);
                            columns.Bound(c => c.ArticleID);
                            columns.Bound(c => c.PickID);
                            columns.Bound(c => c.LineNum);
                            columns.Bound(c => c.Quantity);
                            columns.Bound(c => c.PickedQuantity).HtmlAttributes(new { @id = "test" });
                            columns.Bound(c => c.Status);
                        })
                        .Editable(editable => editable.Mode(GridEditMode.InCell))
                        .HtmlAttributes(new { style = "height: 75%;" })
                        .Scrollable()
                        .Groupable()
                        .Sortable()
                        .Selectable()
                        .RowAction(row =>
                        {
                            if (row.DataItem.Quantity == row.DataItem.PickedQuantity)
                            {
                                row.HtmlAttributes["class"] = "k-state-selected";
                            }
                        })
                        .ToolBar(toolbar =>
                        {
                            toolbar.Custom().Text("Return to Picklists")
                            .HtmlAttributes(new { @style = "color:black; width:100%; height:50%;" })
                            .Action("Picklist", "PickList");
                        })
            .DataSource(dataSource => dataSource
                .Ajax()
                .Events(events => events.Error("error"))
                .Model(model => model.Id(i => i.PickID))
                .Model(model =>
                {
                    model.Field(f => f.PickID).Editable(false);
                    model.Field(f => f.ArticleID).Editable(false);
                    model.Field(f => f.LineNum).Editable(false);
                    model.Field(f => f.Quantity).Editable(false);
                    model.Field(f => f.ArticleName).Editable(false);
                    model.Field(f => f.Status).Editable(false);
                    model.Field(f => f.PickedQuantity).Editable(true);
                })
                .Read(read => read.Action("PickLines_Read", "PickList", new { name = "id", id = Model.FirstOrDefault().PickID }))
                .Update(update => update.Action("submitPickList", "PickList"))
        )
      .Events(events => events
        .Change("onChange")
        .Edit("onEdit")
        .Save("onSave"))
    )

开启编辑:

function onEdit(e) {
    e.container.find("input").bind("focus", function () {
        if (this.style.display != "none") {
            var element = this;
            setTimeout(function () {
                element.select();
            })
        }
    })

    setTimeout(function () {
        document.activeElement.select();
    })
}

1 个答案:

答案 0 :(得分:0)

相反:

var cell = grid.select("tr:eq(" + index + ") td:eq(" + (5) + ")");
grid.editCell(cell);

尝试:

grid.editCell("tr:eq(" + index + ") td:eq(" + (5) + ")");