Javascript runtime error: "object does not support property or method" in Internet Explorer

Question

I use kendo grids and they work great for CRUD operations. Now I wanted to add filtering by adding the .Filterable() parameter to the grid specification. Here is the code:

 <div id="datagrid"> @(Html.Kendo().Grid<SustIMS.Models.ConcessionModel>() .Name("datagrid_Concessions") .Columns(columns => { columns.Bound(c => c.Code).Title("Code"); columns.Bound(c => c.Description).Title("Description"); columns.Bound(c => c.TrafficOpeningDate).Title("Traffic Opening Date"); columns.Bound(c => c.CreationDate).Title("Creation Date"); }) .HtmlAttributes(new { style = "height: 534px;" }) .Filterable() // here the filterable option .Selectable() .Events(e => e.Change("onChange")) .Pageable(pageable => pageable .Refresh(true)) .DataSource(dataSource => dataSource .Ajax() .PageSize(15) .Read(read => read.Action("GetConcessions", "MasterData")) ) ) </div> 

The grid is displayed fine, and now small filter icons are displayed on the column headings of the grid:

But when I click one, the popup opens for half a second and an error occurs. I am using Visual Studio 2010 and the debugger shows a popup with javascript runtime error: object doesn't support property or method 'addBack' .

In addition, he opens the kendo.all.min.js file with highlighting in the line of code where the addBack method is addBack .

NOTE. I tested Chrome and Firefox and it works great. The problem exists only when using Internet Explorer (version 11).

Any help?

Answer 1

Make sure your page has jquery Jquery-1.8.1.min.js or a higher version of jquery . Because addBack added in 1.8 .

Try it,

  @(Html.Kendo().Grid<SustIMS.Models.ConcessionModel>() .Name("datagrid_Concessions") .Columns(columns => { columns.Bound(c => c.Code).Title("Code"); columns.Bound(c => c.Description).Title("Description"); columns.Bound(c => c.TrafficOpeningDate).Title("Traffic Opening Date"); columns.Bound(c => c.CreationDate).Title("Creation Date"); }) .HtmlAttributes(new { style = "height: 534px;" }) .Filterable() // here the filterable option .Selectable() .Events(e => e.Change("onChange")) .Pageable(pageable => pageable .Refresh(true)) .DataSource(dataSource => dataSource .Ajax() .PageSize(15) .Model(model => <--- Add this { model.Id(m => m.Id); model.Field(m => m.Code); model.Field(m => m.Description); }) .Read(read => read.Action("GetConcessions", "MasterData")) ) ) 

See this DEMO: http://jsbin.com/emuqazEz/4/edit

Answer 2

I just tested in IE11 and filtering is working fine.

Kendo User Interface Troubleshooting:

Problem:

The object does not support the property or method 'kendoGrid' (in Internet Explorer 9+)

Decision:

Make sure jQuery is not included more than once in your page. Remove all duplicate script links for jQuery. Include all the necessary Kendo JavaScript files.

This is a simple problem for you, so I would check all my javascript files.