CODEWITHSUNDEEP
asp.net-mvckendo-uikendo-gridkendo-asp.net-mvckendo-multiselect
Federico Navarrete
Federico Navarrete

Reputation: 3274

How can I implement a multiple select for filtering in Kendo Grid ASP MVC?

I'm developing an application with Kendo Controls of 2014 (I don't have access to the newest one 2017 or 2018). In this project, I have several columns of the Foreign Key type like this one:

columns.ForeignKey(p => p.StatusID, (System.Collections.IEnumerable)ViewData["status"], "ID", "Name").HeaderTemplate("Status")

In order to create the grid I followed the basic example:

http://demos.telerik.com/aspnet-core/grid/foreignkeycolumn

For the basic implementation, it looks and works as expected the users can select from a variety of Status or Users in the filtering and editing options.

However, I would like to be able to select more than one at once. I tried to migrate this example, which is for Kendo for jQuery:

http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/filtering/multiselect-used-for-column-filtering.html

Where they implemented a Multi Select.

multiselect

That should be enough to satisfy my needs. I tried to migrate to the ASP MVC and now, it looks like this:

@model object

@(
 Html.Kendo().MultiSelectFor(m => m)
    .BindTo((MultiSelectList)ViewData[ViewData.TemplateInfo.GetFullHtmlFieldName("") + "_Data"])
)

Basically, I replaced the Drop Down list into a Multi Select, but nothing changed my filtering is still displaying the normal Drop Down, there is no Multi Select:

dropdownlist

Maybe I should do more changes, but I don't know what else I should change; I would like to know if someone has ever experienced this before and how they handled it, I have tried multiple examples and codes, but my template newer changes, it's always the Drop Down List. Another interesting example, but it's in jQuery too, I haven't been able to find an implementation in ASP MVC:

http://jsfiddle.net/victordscott/5kbfY/

Besides, I'm aware that what I would like to achieve is available since 2015 Q1:

http://demos.telerik.com/aspnet-mvc/grid/filter-multi-checkboxes

Unfortunately, I don't have access to any newer version as I explained before. Thanks in advance for any idea.

Upvotes: 0

Views: 2089

Answers (1)

womd
womd

Reputation: 3453

don't know if it's available in this older version, but you could give it a try with use of "EditorTemplate"

code for EditorTemplate: (place in folder "EditorTemplates", name it f.e: "myeditortemplate.cshtml")

@model object    

@(Html.Kendo().MultiSelect()
          .Name("optional")
          .AutoClose(false)
          .Placeholder("Select attendees...")
          .BindTo(new List<string>() {
              "value1",
              "value2",        
          })
    )

or for remote-datasource:

@model object    

@(Html.Kendo().MultiSelect()
          .Name("optional")
          .AutoClose(false)
          .Placeholder("Select attendees...")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("ReadAction", "MyController");
              });
          })
    )

then in the grid-definition:

...
..
   column.Bound(c => c.optional).EditorTemplateName("myeditortemplate");
..
..

cheers

Upvotes: 0

Related Questions