EditorTemplate not working on Core 2.1 Razor Pages

4 posts, 0 answers
  1. Awes
    Awes avatar
    2 posts
    Member since:
    Apr 2012

    Posted 10 Aug 2018 Link to this post

    My company is trying to be on the cutting edge. 

    We built some CRUD pages using Kendo UI. But having problems with the drop down list. In .Net Core we are using razor pages, but the concepts is the same.

     

        @(Html.Kendo().Grid<NG.Analytics.Models.Applications>()//(Model.Data)
                        .Name("Grid")
                        .Columns(columns =>
                        {
                            columns.Bound(a => a.Id).Title("ID").Visible(false);
                            columns.Bound(a => a.CategoryId).EditorTemplateName("ApplicationCategory"); //Having trouble with what to put right here. 
                            columns.Bound(a => a.CategoryId).Title("CategoryID");
                            columns.Bound(a => a.Title).Title("Title").Width(200);
                            columns.Bound(a => a.Description).Title("Description");
                            columns.Bound(a => a.BaseUrl).Title("Base Url").Width(120);
                            columns.Bound(a => a.Url).Title("Url");
                            columns.Bound(a => a.IconUrl).Title("Icon Url").Width(350);
                            columns.Bound(a => a.IsExternal).Title("Is External").Width(120);
                            columns.Command(command => { command.Edit(); }).Width(90);
                            columns.Command(command => { command.Destroy(); }).Width(100);
                            columns.Command(command => command.Custom("ViewDetails").Click("showDetails"));
                        })
                        .ToolBar(toolbar => toolbar.Create())
                        .Editable(editable => editable.Mode(GridEditMode.PopUp))
                        .Sortable()
                        .Scrollable()
                        .Filterable()
                        .HtmlAttributes(new { style = "height: 750px;" })
                        .DataSource(dataSource => dataSource
                                .Ajax()
                                .Model(model =>
                                {
                                    model.Id(a => a.Id); // Specify the property which is the unique identifier of the model
                        model.Field(a => a.Id).Editable(false); // Make the ID property not editable
                                                                //model.Field(p => p.CategoryId).DefaultValue(
                                                                //Model.ApplicationCategory as Models.ApplicationCategory);
                    })
                                .Read(read => read.Url("?handler=Data").Type(HttpVerbs.Get))
                                .Create(update => update.Url("?handler=CreateApplications").Type(HttpVerbs.Post))
                                .Destroy(update => update.Url("?handler=Applications").Type(HttpVerbs.Delete))
                                .Update(update => update.Url("?handler=UpdateApplications").Type(HttpVerbs.Put)))
        )

        <partial name="EditorTemplates/ApplicationCategoryEditor" /> //Editor is working as expected when normally use.

    Here is what the partial looks like:

     

    @(Html.Kendo().DropDownList()
                          .Name("CategoryName")
                          .DataTextField("CategoryName")
                          .DataValueField("Id")
                          .BindTo(Model.ApplicationCategory)
                          .HtmlAttributes(new { style = "width: 100%" })
    )

     

    I know you guys are pretty good and responsive. I just hope I can find the answer. 

    Thanks, Trung

  2. Georgi
    Admin
    Georgi avatar
    569 posts

    Posted 14 Aug 2018 Link to this post

    Hi Awes,

    I assume that the issue is caused due to the location of the editor template view. It should be located in ~/Shared/EditorTemplates.

    For your convenience I am attaching a small sample which demonstrates how to create a drop down editor in Razor Pages.


    Regards,
    Georgi
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Awes
    Awes avatar
    2 posts
    Member since:
    Apr 2012

    Posted 14 Aug 2018 in reply to Georgi Link to this post

    Hi Georgi,

    The example that you gave me works for its purpose. 

    I'm trying to get the editor to work in a edit popup. And The EditTemplate does not go through the popup.

    Please let me know if you know how to fix this.

  4. Georgi
    Admin
    Georgi avatar
    569 posts

    Posted 16 Aug 2018 Link to this post

    Hi Awes,

    I apologize for the inconvenience, I did not notice that the grid is in popup edit mode.

    When in popup edit mode the editor can only be specified via DataAnnotations.

    e.g.

    [UIHint("DropDownEditor")]
    public string Address { get; set; }

    For your convenience I am attaching a modified version of the sample from my previous post.


    Regards,
    Georgi
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top