CODEWITHSUNDEEP
asp.net-mvc-3filteringkendo-ui
user1304444
user1304444

Reputation: 1753

KendoUI grid filter not working

I am just starting with Kendo UI. I have a .NET MVC Razor project that will include a Kendo Grid. My page loads fine and looks good-the data is in the grid, but I have two issues:

  1. when I click the "filter" icon, nothing happens (no pop-up, nothing)

  2. when I run the page I get an error in visual studio inside the kendo.all.min.js file (Error: Microsoft JScript runtime error: Object doesn't suport this action. Code highlighted reads "d.transport=new n.data.transports[a.type](c(h,{data:i}))" Running in firebug gives this error: "n.data.transports[a.type] is not a constructor"

I am using a Model that is of type List(CustomViewModel). I have added the following scripts and css to my _Layout partial view: 

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/kendo.all.min.js")" type="text/javascript"></script>

(I tried using "kendo.web.min" and "kendo.aspnetmvc.min" in the place of "kendo.all.min" and I get the same result, but the error is in kendo.web.min.js)

My page looks like this:

@model List<CustomViewModel>
...
@(Html.Kendo().Grid(Model)
    .Name("applicantGrid")
    .Columns(columns =>
    {
        columns.Bound(p => p.ApplicationID);
        columns.Bound(p => p.FirstName);
        columns.Bound(p => p.LastName);            
    })
.Sortable()
.Filterable()  
.Pageable()        
)

My View Model looks like this:

public class CustomViewModel
{
    [ScaffoldColumn(false)]
    public Guid CustomViewModelID { get; set; }

    [Display(Name = "First Name")]
    public string FirstName { get; set; }

    [Display(Name = "Last Name")]
    public string LastName { get; set; }
}

I've noticed that in the Kendo examples (http://demos.kendoui.com/web/grid/local-data.html) the cursor is a hand when it's over the filter icon. On my page, the cursor is an arrow when it's over the filter icon.

Sorting works fine. I've also adjust this example a bit to get select and edit buttons working fine, but the filter just won't work.

I tried posting on the Kendo forums, but haven't gotten a response.

Upvotes: 2

Views: 7194

Answers (1)

Pablo Claus
Pablo Claus

Reputation: 5920

Try this:

Add to your ASP.NET MVC layout page:

<script src="@Url.Content("~/Scripts/kendo.web.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script>

For more information see this: http://www.kendoui.com/documentation/asp-net-mvc/introduction.aspx

And download the last scripts version. Apparently earlier versions of kendo.web.mindont have .Filterable() option.

Upvotes: 5

Related Questions