I have a grid and a popup editor. One column of the grid is a list of objects and it is handled by a multiselect in the editor window. The multiselect list of values depends on the grid row selected for edit, so I cannot bind a list to the multiselect until the grid Edit button click. I am setting the value I need in the grid Edit event and the muitlselect dataSource Read().Data() calls a function to get the value from the edited row. The issue I am having is the multiselect is being bound BEFORE the grid edit event fires, so the Read().Data() call returns a null value and the controller action fails. Can anyone suggest how to fix this or suggest an alternative? Thanks!
To restate the problem with reference to the code below: the Data function of the multiselect "farmIdForSelectedGrouping" which returns the value of "farmId" is called BEFORE the "farmId is set in the Grid Edit event handler "onWipGroupingGridEdit"
View with Grid:
<script type=
"text/kendo"
id=
"bmpListTemplate"
>
<ul class=
"horizontalList"
>
#for(var i = 0; i< data.length; i++){#
<li class=
"horizontalList"
>
#:data[i].BmpNumber#</li>
#}#
</ul>
</script>
<script type=
"text/javascript"
>
var
farmId;
var
bmpTemplate = kendo.template($(
"#bmpListTemplate"
).html(), { useWithBlock:
false
})
function
groupingBmpListChange(e) {
var
row =
this
.element.closest(
"tr"
),
model = $(
"#WipGroupingGrid"
).data(
"kendoGrid"
).dataItem(row);
model.set(
"MiniBmpList"
,
this
.dataItems());
}
function
farmIdForSelectedGrouping() {
return
farmId;
}
function
onWipGroupingGridEdit(e) {
debugger;
grouping = e.model;
farmId = e.model.FarmId;
}
</script>
@(Html.Kendo().Grid<WipGroupingViewModel>()
.Name("WipGroupingGrid")
(the rest of the Grid definition)
.Events(e =>
{
e.Edit("onWipGroupingGridEdit");
})
)
View for popup:
@model WapTool.UIModel.ViewModel.Wip.WipGroupingViewModel
<
div
class
=
"pad-left"
>
<
table
id
=
"wipGroupingTable"
>
<
tbody
>
(other rows left out for brevity)
<
tr
>
<
td
colspan
=
"3"
>
<
div
style
=
"font-size: .8rem"
>
@(Html.Kendo().MultiSelectFor(m => m.MiniBmpList)
.Name("GroupingBmpListMultiSelect")
.DataValueField("Id")
.DataTextField("BmpNumber")
.Events(e => e.Change("groupingBmpListChange"))
.DataSource(d =>
{
d.Custom()
.Type("aspnetmvc-ajax")
.Transport(t =>
{
t.Read(r =>
{
r.Action("FarmBmps", "WipGrouping");
r.Data("farmIdForSelectedGrouping");
r.DataType("json");
});
})
.ServerFiltering(true);
})
.Value(Model.MiniBmpList)
)
</
div
>
</
td
>
</
tr
>
</
tbody
>
</
table
>
</
div
>