pass Grid view model data to Editor template

4 posts, 1 answers
  1. Answer
    Yuhua
    Yuhua avatar
    4 posts
    Member since:
    May 2013

    Posted 05 Jun 2013 Link to this post

    I am trying to implement a Grid with a Dropdownlist as custom Editor Template. The list items in Dropdownlist should be based on value from Grid row.

    My Grid is like this.

    @(Html.Kendo().Grid<GridViewModel>()
                        .Name("grid-results")
                        .Sortable()
                        .Groupable()
                        .Columns(columns =>
                        {
                            columns.Bound(p => p.Id).Hidden().Groupable(false);
                            columns.Bound(p => p.Total)
                                .ClientFooterTemplate("Grand Total: #=kendo.toString(sum, 'C4')#")
                                .FooterHtmlAttributes(new { style = "font-weight:bold; text-align:right;" })
                                .HtmlAttributes(new { style = "text-align:right" });
                            columns.Bound(p => p.StatusId ).Title("Resolution Status")
                                .ClientTemplate("#=StatusName#")
    ============> .EditorViewData(new { statusId = "#=StatusId #" })
                                .EditorTemplateName("StatusList"); // file name
                            columns.Bound(p => p.User);
                        })
                        .Pageable(paging => paging
                          .Info(false)
                          .Input(true)
                          .Numeric(false)
                          .PageSizes(new Int32[] { 5, 10, 20 })
                          )
                        .Editable(editable =>
                        {
                            editable.Mode(GridEditMode.InCell);
                        })
                        .Resizable(configurator => configurator.Columns(true))
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .ServerOperation(true)
                            .Read(read =>
                            {
                                read.Action("GetResults", "Home").Data("onFilterSelection");
                            })
                            .PageSize(10)
                            .Model(model =>
                            {
                                model.Id(p => p.PoId);
                                model.Field(p => p.Total).Editable(false);
                                model.Field(p => p.StatusId ).Editable(true);
                                model.Field(p => p.User).Editable(false);
                            })
                            .Aggregates(aggregates =>
                            {
                                aggregates.Add(p => p.Total).Sum();
                            })
                        )
                    )

    editor template is like
    @(Html.Kendo().DropDownList()
            .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
            .DataValueField("ListStatusId")
            .DataTextField("ListStatusName")
            .DataSource(dataSource =>
                {
                    dataSource.Read(read =>
                        {
                            read.Action("GetStatusList", "Home", new { statusId = ViewData["statusId"] });
                        });
                })
    )
    Controller Action:
    public JsonResult GetCustomizeResolutionStatusList(string statusId)
            {
                List<StatusModel> status = new List<StatusModel>();

               // code to get list of StatusModel based on statusId

                return status ;
            }
    GridViewModel
    public class GridViewModel
        {
            public int Id { get; set; }
            public decimal Total { get; set; }
            public short StatusId { get; set; }
            public string StatusName { get; set; }
            public string User{ get; set; }
    }

    StatusModel
    public class StatusModel
        {
            public int ListStatusId { get; set; }
            public String ListStatusName { get; set; }
        }

    I tried to use .EditorViewData(new { statusId = "#=StatusId #" }) to pass GridViewModel.StatusId to dropdownlist editor template. But it doesn't work.
    I can't use Model.StatusId since the page level view model is different from Grid view model.
    Can someone please help me with this?

    Thanks.

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 07 Jun 2013 Link to this post

    Hi Yuhua,

     
    Please note note that the editor templates are get from the server on Grid initialization (only once) - that why when the EditorTemplate is generated the passed "StatusID" is null. Possible solution to pass the current record ID to the editor is to use external JavaScript function: 

    EditorTemplate: 

    @model object
     
    @(Html.Kendo().DropDownListFor(m => m)
        .DataValueField("ListStatusId")
        .DataTextField("ListStatusName")
        .DataSource(d =>
            //get the additional data using function in the main view
            d.Read(r => r.Action("GetStatusList", "Home").Data("getParentID()"))
         
        )
    )

    getParentID function: 
    function getParentID() {
        var row = $(event.srcElement).closest("tr");
        var grid = $(event.srcElement).closest("[data-role=grid]").data("kendoGrid");
        var dataItem = grid.dataItem(row);
        //where the OrderID is the model ID
        return { statusId: dataItem.StatusId }
    }
    Kind Regards,
    Vladimir Iliev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Bryan
    Bryan avatar
    24 posts
    Member since:
    Nov 2013

    Posted 13 Jul 2014 in reply to Vladimir Iliev Link to this post

    I have tried this exactly as you have described and it doesn't work. The value of "grid" is null. I have a dropdownlist in a grid column and I'm trying to find a way to past the grid item's model Id to the method that populates the drop down list. I'm having a hard time believing there is no support for doing this fairly basic functionality.
  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 14 Jul 2014 Link to this post

    Hi Bryan,

    As from the provided information is not clear for us what is the exact scenario that you have - could you please open new support thread / forum post and provide the following additional information:

    • Grid code
    • Grid Model definition
    • Custom EditorTemplate that is used

    Regards,
    Vladimir Iliev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready