Kendo MVC ListView Editing

问题

please check the below code

---

@model IEnumerable<Polls.Core.domain.Address>

<div class="demo-section">
    <a class="k-button k-button-icontext k-add-button" href="#"><span class="k-icon k-add"></span>Add new record</a>
</div>

<script type="text/x-kendo-tmpl" id="template">
    <div class="product-view k-widget">
        <div class="edit-buttons">
            <a class="k-button k-button-icontext k-edit-button" href="\\#"><span class="k-icon k-edit"></span></a>
            <a class="k-button k-button-icontext k-delete-button" href="\\#"><span class="k-icon k-delete"></span></a>
        </div>
        <dl>
            <dt>AddressType</dt>
            <dd>#:AddressType#</dd>

            <dt>Line1</dt>
            <dd>#:Line1#</dd>

            <dt>Line2</dt>
            <dd>#:Line2#</dd>

            <dt>Line3</dt>
            <dd>#:Line3#</dd>

            <dt>City</dt>
            <dd>#:City#</dd>

            <dt>State</dt>
            <dd>#:State#</dd>
        </dl>
    </div>
</script>

<script type="text/x-kendo-tmpl" id="editTemplate">
    <div class="product-view k-widget">
        <div class="edit-buttons">
            <a class="k-button k-button-icontext k-update-button" href="\\#"><span class="k-icon k-update"></span>Save</a>
            <a class="k-button k-button-icontext k-cancel-button" href="\\#"><span class="k-icon k-cancel"></span>Cancel</a>
        </div>
        <dl>
            <dt>AddressType</dt>
            <dd>#:AddressType#</dd>

            <dt>Line1</dt>
            <dd>#:Line1#</dd>

            <dt>Line2</dt>
            <dd>#:Line2#</dd>

            <dt>Line3</dt>
            <dd>#:Line3#</dd>

            <dt>City</dt>
            <dd>#:City#</dd>

            <dt>State</dt>
            <dd>#:State#</dd>
        </dl>
    </div>
</script>

<div class="demo-section">
    @(Html.Kendo().ListView<Polls.Core.domain.Address>(Model)
    .Name("listView")
    .TagName("div")
    .ClientTemplateId("template")
    .Editable(editor => editor.TemplateName("editTemplate"))
    .Pageable()
    .DataSource(dataSource => dataSource
        .Model(model => model.Id("Id"))
        .PageSize(6)
                .Create(create => create.Action("Address_Create", "Test"))
                .Read(read => read.Action("Address_Read", "Test"))
                .Update(update => update.Action("Address_Update", "Test"))
                .Destroy(destroy => destroy.Action("Address_Destroy", "Test"))
    )
    )
</div>

<script>
    $(function () {
        var listView = $("#listView").data("kendoListView");

        $(".k-add-button").click(function (e) {
            listView.add();
            e.preventDefault();
        });
    });
</script>

---

Someone guide how to refer the Edit Template. Currently when I click the Edit / Add New Button it show all the entity available in model. I want only the selected fields to appear while editing.

Someone please help in this regard.

回答1:

There are two ways to use an editor template with the Kendo Listview:

1. Create a folder and file called Views\EditorTemplates\{yourViewModel}.cshtml for Razor or yourViewModel.ascx for the aspx view engine.

   or

2. Explicitly specify the editor template name in the Editable method:

   .Editable(editable => editable.TemplateName("editTemplate"))

回答2:

Kendo MVC uses a folder to reference edit templates this folder you will find it at View/Shared/EditorTemplates (If the folder does not exist, just create it). Inside this folder you can insert all the templates you will call by name, example:

@(Html.Kendo().ListView<temp.Models.YourTable>(Model)
    .Name("listView")
    .TagName("div")
    .ClientTemplateId("template") // here goes the template for data
    .DataSource(dataSource => dataSource
        .Model(m => m.Id("ID"))
        .ServerOperation(false)
        .Read(read => read.Action("ActionRead", "Controller"))
    )
    .Editable(edit => edit.TemplateName("EditTmpl")) // here goes the template name for edit mode 
)

EditTmpl.cshtml => // this template is the one that you must store in the folder that I refer above.

hope this helps.

来源：https://stackoverflow.com/questions/22702969/kendo-mvc-listview-editing