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?