[Solved] Cascading DropDownList In InCell Editable Grid Not Displaying Selected Value

[Jason]

I have an InCell editable (updating in BATCH) grid with several columns and 2 columns showing as dropdown lists.  the 2nd dropdown list is cascading from the first dropdown list.  I finally have the 2nd dropdown list working properly except that once I select the value and move to the next row in the grid, the selected value is disappearing.  I found an example from Telerik where this is working but for some reason, it's not working in my solution.  Here's my code:

 

ViewModel(s):

<p>public class ForeignKeyViewModel     {
        public IEnumerable<DefectGroupDropdownViewModel> DefectGroups { get; set; }
        public IEnumerable<ScrapReasonDropdownViewModel> ScrapReasons { get; set; }
    }</p><p></p><br><p>public class SingleScrapJobViewModel     {
        public string CoilId { get; set; }
        [Display(Name="Activity Date")]
        [DisplayFormat(DataFormatString = "g")]
        public DateTime ActivityDate { get; set; }

        [Display(Name = "Date Scrapped", Description = "Date coil was actually scrapped.")]
        [DisplayFormat(DataFormatString = "g")]
        public DateTime DateScrapped { get; set; }
        public string LineTypeCode { get; set; }
        public int LineTypeId { get; set; }

        public int QuantityTypeId { get; set; }
        [Required]
        public int TeamId { get; set; }
        public decimal EntryWeight { get; set; }
        public decimal EntryWidth { get; set; }

        [UIHint("DefectGroupId")]
        [Required(ErrorMessage = "DefectGroupId is required")]
        public int DefectGroupId { get; set; }



        [UIHint("ScrapReasonId")]
        [Required(ErrorMessage = "ScrapReasonId is required")]
        public int ScrapReasonId { get; set; }
        public decimal AmountScrapped { get; set; }


    }</p>

 

View:

@model ForeignKeyViewModel@{     ViewBag.Title = "Scrapped Coils";
     }<h2>Assign Scrap Reasons to Coils Scrapped on a Single Job</h2><br/><div class="container"><div class="row">         @(Html.Kendo().Grid<SingleScrapJobViewModel>()
              .Name("ScrappedCoilsGrid")
              .Columns(col =>               {
                  col.Bound(m => m.CoilId).Title("Coil Id");
                  col.Bound(m => m.LineTypeCode).Title("Process Code");
                  col.Bound(m => m.LineTypeId).Hidden(true);
                  col.Bound(m => m.EntryWeight).Title("Entry Weight");
                  col.Bound(m => m.AmountScrapped).Title("Amount Scrapped (Lbs)");
                  col.ForeignKey(k => k.DefectGroupId, Model.DefectGroups, "DefectGroupId", "DefectGroupName").Width(200).EditorTemplateName("DefectGroupId").Title("Category");
                  col.ForeignKey(k => k.ScrapReasonId, Model.ScrapReasons, "ScrapReasonId", "ScrapReasonName").Width(200).EditorTemplateName("ScrapReasonId").Title("Scrap Reason");

              })
              .Editable(e=>e.Mode(GridEditMode.InCell))

              .ToolBar(toolbar =>               {
                  toolbar.Save();
              })
              .Sortable()
              .NoRecords("There are no records to show.")
              .Scrollable(scr => scr.Height(500))
              .DataSource(ds => ds
                  .Ajax()
                  .Batch(true)
                  .PageSize(30)
                  .Events(e => e.Change("onChange"))
                  .ServerOperation(true)
                  .Model(m =>                   {
                      m.Id(p => p.CoilId);
                      m.Field(f => f.CoilId).Editable(false);
                      m.Field(f => f.LineTypeCode).Editable(false);
                      //m.Field(f => f.DefectGroupId).DefaultValue(1);                       //m.Field(f => f.DefectGroup).DefaultValue(ViewData["DefaultDefectGroup"] as DropDownViewModel);                       //m.Field(f => f.ScrapReasonId);                       m.Field(f => f.EntryWeight).Editable(false);
                      //m.Field(f => f.AmountScrapped);                       m.Field(f => f.ActivityDate).Editable(false);

                      //m.Field(f => f.ScrapReason).DefaultValue(ViewData["DefaultScrapReason"] as DropDownViewModel);                   })

                  .Update(u=>u.Action("SaveSingleJobScrappedCoils", "ScrapAssignment"))

              ))     </div></div>

 

DefectGroupId EditorTemplate:

@model int@(Html.Kendo().DropDownListFor(m => m)
      .AutoBind(false)
      .OptionLabel("Select Category...")
      .DataTextField("DefectGroupName")
      .DataValueField("DefectGroupId")
      .DataSource(dataSource =>       {
          dataSource.Read(read => read.Action("GetDefectGroupsDropdownViewModelForGrid", "ScrapAssignment"))
              .ServerFiltering(true);
      })
      )@Html.ValidationMessageFor(m => m)

 

 

ScrapReasonId EditorTemplate:

@model int@(Html.Kendo().DropDownListFor(m => m)
      .AutoBind(false)
      .OptionLabel("Select Scrap Reason...")
      .DataTextField("ScrapReasonName")
      .DataValueField("ScrapReasonId")
      .DataSource(dataSource =>       {
          dataSource.Read(read => read.Action("GetScrapReasonsDropdownViewModelForGrid", "ScrapAssignment").Data("filterScrapReasons"))
              .ServerFiltering(true);
      })
      .CascadeFrom("DefectGroupId")
      )@Html.ValidationMessageFor(m => m)

 

 

Javascript in View:

function onChange(e) {
        if (e.action == "itemchange") {
            if (e.field == "DefectGroupId") {
                debugger;
                var model = e.items[0];
                model.set("ScrapReasonId", 0);
            }

        }
    }

    function filterScrapReasons() {
        var model = getCurrentEditedModel();
        return { defectGroupId: model.DefectGroupId };
    }

    function getCurrentEditedModel() {
        var grid = $("#ScrappedCoilsGrid").data("kendoGrid");
        var editRow = grid.tbody.find("tr:has(.k-edit-cell)");
        var selectedItem = grid.dataItem(editRow);
        debugger;
        return grid.dataItem(editRow);
    }

 

 

Been working on this for several days trying to get it to work.  Any ideas on how to get that 2nd dropdownlist to behave properly?

[Jason]

Found the issue.  The Model that was being passed into the View did not contain all values.  Once all values were passed in, the 2nd dropdown began behaving as expected.