Hi,
I'm trying to use the grid component in a huge legacy ASP.NET MVC 5 project. For some reason the ​Html.Kendo().Grid() helper does not serialize my grid's data if I am using it in this project, but it does serialize the data if I use it in a brandnew ASP.NET MVC project.
I used the same source code in the view for both projects:
@{
var dummy = new List<
DummyModel
>
{
new DummyModel
{
Col1 = "Foo1",
Col2 = "Bar1"
},
new DummyModel
{
Col1 = "Foo2",
Col2 = "Bar2"
}
};
}
@(Html.Kendo().Grid(dummy).Name("MyGrid")
.Columns(col =>
{
col.Bound(c => c.Col1);
col.Bound(c => c.Col2);
}))
In a brand new MVC5 project, this renders the following html / js code blocks:
<
div
class
=
"k-widget k-grid"
id
=
"MyGrid"
>
<
table
>
<
colgroup
>
<
col
/><
col
/>
</
colgroup
><
thead
class
=
"k-grid-header"
>
<
tr
>
<
th
class
=
"k-header"
data-field
=
"Col1"
data-index
=
"0"
data-title
=
"Col1"
scope
=
"col"
>
<
span
class
=
"k-link"
>Col1</
span
></
th
><
th
class
=
"k-header"
data-field
=
"Col2"
data-index
=
"1"
data-title
=
"Col2"
scope
=
"col"
>
<
span
class
=
"k-link"
>Col2</
span
></
th
>
</
tr
>
</
thead
><
tbody
>
<
tr
>
<
td
>Foo1</
td
><
td
>Bar1</
td
>
</
tr
><
tr
class
=
"k-alt"
>
<
td
>Foo2</
td
><
td
>Bar2</
td
>
</
tr
>
</
tbody
>
</
table
>
</
div
>
<
script
>
jQuery(function() {
jQuery("#MyGrid").kendoGrid({
"columns": [{ "title": "Col1", "headerAttributes": { "data-field": "Col1", "data-title": "Col1" }, "field": "Col1", "encoded": true }, { "title": "Col2", "headerAttributes": { "data-field": "Col2", "data-title": "Col2" }, "field": "Col2", "encoded": true }], "scrollable": false, "messages": { "noRecords": "No records available." }, "autoBind": false,
"dataSource": {
"type": (function() {
if (kendo.data.transports['aspnetmvc-server']) {
return 'aspnetmvc-server';
} else {
throw new Error('The kendo.aspnetmvc.min.js script is not included.');
}
})(),
"transport": { "read": { "url": "" }, "prefix": "MyGrid-" },
"serverPaging": true,
"serverSorting": true,
"serverFiltering": true,
"serverGrouping": true,
"serverAggregates": true,
"filter": [],
"schema": { "data": "Data", "total": "Total", "errors": "Errors", "model": { "fields": { "Col1": { "type": "string" }, "Col2": { "type": "string" } } } }
}
});
});
</
script
>​
This works fine and the table is displayed correctly.
​However, in my legacy project this renders the following html / js code blocks:
<
div
class
=
"k-widget k-grid"
id
=
"MyGrid"
>
<
table
>
<
colgroup
></
colgroup
><
thead
class
=
"k-grid-header"
></
thead
><
tbody
>
<
tr
></
tr
><
tr
class
=
"k-alt"
></
tr
>
</
tbody
>
</
table
>
</
div
>
<
script
>
jQuery(function() {
jQuery("#MyGrid").kendoGrid({
"scrollable": false, "messages": { "noRecords": "Keine Aufzeichnungen zur Verfügung." }, "autoBind": false,
"dataSource": {
"type": (function() {
if (kendo.data.transports['aspnetmvc-server']) {
return 'aspnetmvc-server';
} else {
throw new Error('The kendo.aspnetmvc.min.js script is not included.');
}
})(),
"transport": { "read": { "url": "" }, "prefix": "MyGrid-" },
"serverPaging": true,
"serverSorting": true,
"serverFiltering": true,
"serverGrouping": true,
"serverAggregates": true,
"filter": [],
"schema": { "data": "Data", "total": "Total", "errors": "Errors", "model": { "fields": { "Col1": { "type": "string" }, "Col2": { "type": "string" } } } }
}
});
});
</
script
>
The js code is identical to the brand new MVC 5 project, but the html code is missing the serialized data, which results in the table not being displayed correctly. You can easily see this by the fact that the strings "foo" or "bar" are nowhere in the source code.
I have double-checked that both projects are using the same Kendo.Mvc.dll reference, so that can't be the problem. I've also read the manual twice on how to set up Kendo UI twice and that did not help, so now I am stuck.
Thanks in advance for your help,
Adrian