Question

我的应用程序中有一个kendo网格。 enter image description here

@(Html.Kendo().Grid<TekstenViewModel.Tekst>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Template(@<text></text>).ClientTemplate("<input type='checkbox'/>").Width(10).Hidden(!Model.Administrator);

        columns.Bound(product => product.ResourceSetNaam).ClientTemplate("#= ResourceSetNaam#").Title("Groep");

        columns.Bound(product => product.Naam).ClientTemplate("#= Naam#");

        columns.Bound(product => product.Waarde).ClientTemplate("<div id='editorDiv'><div class='input'>#if(Waarde){# #if(Waarde.length>100){# # var myContent =Waarde; #  # var dcontent = myContent.substring(0,100); # <span>#=kendo.toString(dcontent)#</span> #}else{# <span>#=Waarde#</span> #}# #}#</div><div class='editor'>" +
            Html.WebCore().LinkButton(type: ButtonType.Edit, htmlAttributes: new { onclick = "onOpenEditorPopup('#: Waarde #', '#: Id #', 'Waarde')" })).Title("Tekst (Nederlands)");

        columns.Bound(product => product.Opmerking).ClientTemplate("<div id='editorDiv'><div class='input'>#if(Opmerking){# #if(Opmerking.length>100){# # var myContent =Opmerking; #  # var dcontent = myContent.substring(0,100); # <span>#=kendo.toString(dcontent)#</span> #}else{# <span>#=Opmerking#</span> #}# #}#</div><div class='editor'>" +
            Html.WebCore().LinkButton(type: ButtonType.Edit, htmlAttributes: new { onclick = "onOpenEditorPopup('#: Opmerking #', '#: Id #', 'Opmerking')" })).Title("Omschrijving");

        columns.Template(@<text></text>).ClientTemplate("<div id='deleteDiv'><div class='delete'><a class=\"delete iconBtn\" onclick=\"deleteResourceItem(#: Id #, '#: Naam #')\"></a></div></div>").Width(10).Hidden(!Model.Administrator);
    })
    .Pageable()
    .Sortable()
    .Filterable()
    .Events(events => events.Edit("onCellEdit").DataBinding("onDataBinding"))
    .Groupable()
    .Resizable(a => a.Columns(true))
    .Navigatable()
    .Editable(editable => editable.Mode(GridEditMode.InCell).DisplayDeleteConfirmation(false).CreateAt(GridInsertRowPosition.Bottom))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .Events(e => e.Error("onErrorhandling"))
        .Model(model =>
        {
            model.Id(product => product.Id);
            model.Field(product => product.Naam).Editable(Model.Administrator);
            model.Field(product => product.Opmerking).Editable(Model.Administrator);
            model.Field(product => product.Waarde).Editable(!Model.ReadOnly);
            model.Field(product => product.ResourceSetId).DefaultValue(Model.SetId);
            model.Field(product => product.Type).DefaultValue(Domain.Agromilieu2.Common.Objects.Entities.Resources.ResourceType.GLOBAL_RESOURCES);
            model.Field(product => product.Taal).DefaultValue(Domain.Agromilieu2.Common.Agromilieu2Constants.Resources.DEFAULT_TAAL_CODE);
        })
        .Create(create => create.Action(MVC.BeheerTeksten.ActionNames.CreateResourceItems, MVC.BeheerTeksten.Name).Data("onCreateAdditionalData"))
        .Read(read => read.Action(MVC.BeheerTeksten.ActionNames.ReadResourceItems, MVC.BeheerTeksten.Name, new { setId = Model.SetId }).Data("onReadAdditionalData"))
        .Update(update => update.Action(MVC.BeheerTeksten.ActionNames.UpdateResourceItems, MVC.BeheerTeksten.Name).Data("onUpdateAdditionalData"))
        .Destroy(destroy => destroy.Action(MVC.BeheerTeksten.ActionNames.DeleteResourceItems, MVC.BeheerTeksten.Name))
        )
)

例如，当我单击Waarde列中文本旁边的按钮时，我打开带有文本的Kendo编辑器。

enter image description here

当我单击“确定”时，我将编辑后的文本返回到网格。

var selectedGridRowId = 0;
var selectedGridColumnName;
function onOpenEditorPopup(gridCellContent, gridIdentifier, columnIdentifier, ReadOnly, Administrator) {
        var editor = $("#waardeEditor").data("kendoEditor")

        if ((ReadOnly == "false" && Administrator == "false" && columnIdentifier != "Waarde") || ReadOnly == "true") {
            editor.body.contentEditable = false;
            $('.k-editor-toolbar').hide();
        }
        else {
            editor.body.contentEditable = true;
            $('.k-editor-toolbar').show();
        }

        editor.value(htmlDecode(gridCellContent));
        domain.WebCore.popup.show("textEditor");

        selectedGridRowId      = gridIdentifier;
        selectedGridColumnName = columnIdentifier;
    };


 domain.WebCore.popup.configure("textEditor")
        .click(function (b) {
            var grid       = $("#Grid").data("kendoGrid");
            var editor     = $("#waardeEditor").data("kendoEditor")
            var parentItem = grid.dataSource.get(selectedGridRowId);

            parentItem.set(selectedGridColumnName, htmlEscape(htmlEncode(editor.value())));
        });

我使用selectedGridRowId和selectedGridColumnName来知道返回编辑文本的位置。但是我的一位同事发现了一个错误，它并没有使用新记录。

如果有人输入新记录并尝试在Waarde列中输入文本，例如，通过文本编辑器，selectedGridRowId和selectedGridColumnName都为null，这很明显。

然后我得到一个＆＃34; Uncaught TypeError：无法读取属性＆＃39; value＆＃39;未定义的＆＃34;，也有明显的原因，而且来自这里

var parentItem = grid.dataSource.get(selectedGridRowId);

                parentItem.set(selectedGridColumnName, htmlEscape(htmlEncode(editor.value())));

我该如何解决这个问题？

Answer 1

找到解决方案。

我使用的是uid而不是id和getByUid而不是get

所以这里是解决方案的代码

columns.Bound(product => product.Waarde).ClientTemplate("<div id='editorDiv'><div class='input'>#if(Waarde){# #if(Waarde.length>100){# # var myContent =Waarde; #  # var dcontent = myContent.substring(0,100); # <span>#=kendo.toString(dcontent)#</span> #}else{# <span>#=Waarde#</span> #}# #}#</div><div class='editor'>" +
            Html.WebCore().LinkButton(type: ButtonType.Edit, htmlAttributes: new { title = "Aanpassen", onclick = "onOpenEditorPopup('#: Waarde #', '#= uid #', 'Waarde')" })).Title("Tekst (Nederlands)");

 columns.Bound(product => product.Opmerking).ClientTemplate("<div id='editorDiv'><div class='input'>#if(Opmerking){# #if(Opmerking.length>100){# # var myContent =Opmerking; #  # var dcontent = myContent.substring(0,100); # <span>#=kendo.toString(dcontent)#</span> #}else{# <span>#=Opmerking#</span> #}# #}#</div><div class='editor'>" +
            Html.WebCore().LinkButton(type: ButtonType.Edit, htmlAttributes: new { title = "Aanpassen", onclick = "onOpenEditorPopup('#: Opmerking #', '#= uid #', 'Opmerking')" })).Title("Omschrijving");


 function onOpenEditorPopup(gridCellContent, gridIdentifier, columnIdentifier, ReadOnly, Administrator) {
        var editor = $("#waardeEditor").data("kendoEditor")

        if ((ReadOnly == "false" && Administrator == "false" && columnIdentifier != "Waarde") || ReadOnly == "true") {
            editor.body.contentEditable = false;
            $('.k-editor-toolbar').hide();
        }
        else {
            editor.body.contentEditable = true;
            $('.k-editor-toolbar').show();
        }        

        editor.value(htmlDecode(gridCellContent));
        domain.WebCore.popup.show("textEditor");

        selectedGridRowId      = gridIdentifier;
        selectedGridColumnName = columnIdentifier;
    };


domain.WebCore.popup.configure("textEditor")
        .click(function (b) {
            var grid = $("#Grid").data("kendoGrid");
            var editor = $("#waardeEditor").data("kendoEditor")
            var parentItem = grid.dataSource.getByUid(selectedGridRowId);

            parentItem.set(selectedGridColumnName, htmlEscape(htmlEncode(editor.value())));
        });

如何获取Kendo Grid中新记录行的id

1 个答案: