I have two models with relationship "Many to Many", Books, Authors, and their context Library. All source files included correctly. Cannot set selected Authors to the cell(because row is null, so model cannot be set). There is using InCell editor. I will be glad to any ideas)
UPD: new error occurred when I add a new line
Unable to get property 'map' of undefined or null reference
Index.cs.html:(error in change function, second error in dataBound function)
@{
ViewBag.Title = "Home Page";
}
@(Html.Kendo().Grid<ManyToMany.Models.ViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(e => e.BookId).Visible(false);
columns.Bound(e => e.Pages);
columns.Bound(e => e.Genre);
columns.Bound(e => e.Publisher);
columns.Bound(e => e.Authors).ClientTemplate(
Html.Kendo().MultiSelect().Name("multi#=BookId#")
.DataTextField("AuthorName")
.DataValueField("AuthorId")
.BindTo((IEnumerable<ManyToMany.Models.Author>)ViewData["authors"]) /*TaskSecond.Models.ViewModel*/
.Events(e => e.Change("change"))
.ToClientTemplate().ToHtmlString()
);
columns.Command(command => command.Destroy()).Width(150);
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Pageable()
.Filterable()
.Events(e => e.DataBound("dataBound"))
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.Model(model =>
{
model.Id(p => p.BookId);
model.Field(p => p.Pages).DefaultValue(0);
model.Field(p => p.Genre).DefaultValue(0);
model.Field(p => p.Publisher).DefaultValue("");
model.Field(p => p.Authors).DefaultValue(
ViewData["defaultAuthors"] as ManyToMany.Models.Author);
})
.PageSize(5)
.Read(read => read.Action("Books_Read", "Grid"))
.Create(create => create.Action("Books_Create", "Grid"))
.Update(update => update.Action("Books_Update", "Grid"))
.Destroy(destroy => destroy.Action("Books_Destroy", "Grid"))
.ServerOperation(false))
)
<script type="text/javascript">
function dataBound(e) {
var grid = this;
grid.tbody.children().each(function () {
var dataitem = grid.dataItem(this),
row = $(this);
eval(row.find("script").html());
var multiSelect = $(this).find("select").data("kendoMultiSelect");
//here
multiSelect.value(dataitem.Authors.map(function (i) { return i.AuthorId }));
});
}
function change(e) {
//error is here
var row = this.element.closest("tr"),
model = $("#grid").data("kendoGrid").dataItem(row);
model.set("Authors", this.dataItems());
}
</script>
ViewModel.cs:
public class ViewModel
{
public ViewModel()
{
Authors = new List<Author>();
}
public int BookId { get; set; }
public string BookName { get; set; }
public int Pages { get; set; }
public Genre Genre { get; set; }
public string Publisher { get; set; }
[UIHint("AuthorsEditor")]
public List<Author> Authors { get; set; }
}