I am trying to use popup editing with a grid that uses <dynamic> so that I can pass in any model and re-use it.I was able to reproduce my issue by editing the "editing_popup.cshtml" file in the "Kendo.MvcExamples" solution.
Notice that I explicitly told the template "ProductViewModel" to be used. Initally it wasn't using that template, until I moved it into Views\Shared\EditorTemplates. But once I did I got the same error I get from my own project:
Inner Exception: System.InvalidOperationException: The model item passed into the dictionary is of type 'System.Object', but this dictionary requires a model item of type 'Kendo.Mvc.Examples.Models.ProductViewModel'.
I understand WHY, I'm getting this error; the grid basically treats dynamic as an object and that is what is being sent to the viewmodel's template ("ProductViewModel.cshtml"). My question, is is there someway I can get around it, even if I have to pass in a "Type" object.
@(Html.Kendo().Grid<
dynamic
>()
.Name("grid")
.Columns(columns =>
{
columns.Bound("ProductName");
//columns.Bound(p => p.ProductName);
//columns.Bound(p => p.UnitPrice).Width(120);
//columns.Bound(p => p.UnitsInStock).Width(120);
//columns.Bound(p => p.Discontinued).Width(120);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(250);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ProductViewModel"))
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
//.Model(model => model.Id(p => p.ProductID))
.Model(model => model.Id("ProductID"))
.Create(update => update.Action("EditingPopup_Create", "Grid"))
.Read(read => read.Action("EditingPopup_Read", "Grid"))
.Update(update => update.Action("EditingPopup_Update", "Grid"))
.Destroy(update => update.Action("EditingPopup_Destroy", "Grid"))
)
)
<
script
type
=
"text/javascript"
>
function error_handler(e) {
if (e.errors) {
var message = "Errors:\n";
$.each(e.errors, function (key, value) {
if ('errors' in value) {
$.each(value.errors, function () {
message += this + "\n";
});
}
});
alert(message);
}
}
</
script
>