Bind Kendo Dropdown list as one column in Kendo Grid

2 posts, 0 answers
  1. Vetrivelan
    Vetrivelan avatar
    3 posts
    Member since:
    Aug 2017

    Posted 16 Oct 2017 Link to this post

    Hi Team ,

    I am trying to add Kendo dropdownlist as part of Grid one grid column using EditorTemplates  and it was successfully added but it was not binded to model and it was not  reflect in cell  which is selected from kendo dropdownlist.

     

    I am usinh MVC5 and Kendo version 2015.1.429

    Here is my code

    .Grid<TEData.Model.Gen_Lists>().Deferred()
    .Name("grdGen")
    .Columns(cl =>
    {
    cl.Bound(u => u.TED_ENT_DATA_DAY_GEN_ID).Hidden(true);
    cl.Bound(u => u.hourEnding).Width("10ex");
    cl.Bound(u => u.actual).Width("10ex").Title("Actual");
    //cl.Bound(u => u.Actual_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:Actual_Reason.reasonName #");
    cl.Bound(u => u.Actual_Reason).Title("Reason").ClientTemplate("#:Actual_Reason.reasonName #");
    cl.Bound(u => u.actual_Reason_Notes).Title("Notes");
    cl.Bound(u => u.totalCapacity).Title("Total Capacity").Width("10ex");
    cl.Bound(u => u.totalCapacity_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:totalCapacity_Reason.reasonName #");
    cl.Bound(u => u.totalCapacity_Reason_Notes).Title("Notes");
    cl.Bound(u => u.runState).Title("Run State").Width("10ex");
    cl.Bound(u => u.runState_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:runState_Reason.reasonName #");
    cl.Bound(u => u.runState_Reason_Notes).Title("Notes");
    //cl.Bound(u => u.reasonlist).ClientTemplate("#: reasonlist.reasonName#");
    //cl.Bound(u => u.reasonlist.reasonCode).EditorTemplateName("ReasonEditor").ClientTemplate("#:reasonlist.reasonName #");
    })
    .Sortable()
    //.Scrollable()
    .Editable(ed => ed.Mode(GridEditMode.InCell))
    .DataSource(ds =>
    {
    ds.Ajax()
    .Batch(true)
    .ServerOperation(false)
    .Model(
    m => {
    m.Id(u => u.TED_ENT_DATA_DAY_GEN_ID);
    m.Field(u => u.hourEnding).Editable(false);
    //m.Field(u => u.reasonlist).DefaultValue(ViewData["defaultReason"] as TEData.Model.Gen_Lists);
    }
    )
    .Read(rd => rd.Action("Get_Data", "TECommon")
    .Data("userInput")
    );
    })

     

    EditorTemplates Code

    @model TEData.Model.ReasonCode_Lists
    @(Html.Kendo()
    .DropDownListFor(m => m.reasonName)
    .Name("ddlEditor")
    .DataTextField("reasonName")
    .DataValueField("reasonCode")
    .DataSource(d=>d.Read(r=>r.Action("Get_Reason_Codes", "TECommon")))
    )

    I have tried some sample from  telerik and it was not helped me. Please help me

    http://demos.telerik.com/aspnet-mvc/grid/editing-custom

    Thanks,

    Vetri.

     

     

     

     

     

  2. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2480 posts

    Posted 18 Oct 2017 Link to this post

    Hi Vetrivelan,

    I have examined the code and noticed that the dropdown editor is defined as DropDownListFor. Additionally the Name property for it was also specified. Note that when using <WidgetName>For the Name property should be omitted. It will be set automatically to match the name of the field in the Model.

    An alternative approach you can use for the editor template is to use DropDownList and set the Name for it. In that case the Name property should match exactly the name of the field in the Model.

    If you would like more information on using editor templates you would find the article below interesting.


    With that said, it is always recommended to use the latest version of the components. The current release is R3 2017 and there is Service Pack underway that should be available for download this week. Please update the components to the latest version and let me know how it works for you.

    In case the issue persists please send us a runnable sample where it is replicated. This way we will be able to examine the behavior locally and look for its cause. 


    Regards,
    Viktor Tachev
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top