GerardBeckerleg
GerardBeckerleg

Reputation: 902

How to change the default filter operator in kendo ui grid mvc

I have managed to change the default filter order for the Kendo Grid using:

.Filterable(filterable => filterable
                        .Extra(true)
                        .Operators(ops => 
                            ops.ForString(str => str.Clear()
                                                    .Contains("Contains")
                                                    .StartsWith("Starts with")
                                                    .EndsWith("Ends with")
                                                    .IsEqualTo("Is equal to"))
                        ))

Is there any way I can change the default operator to OR?

enter image description here

Upvotes: 12

Views: 11659

Answers (3)

Ion Ursachi
Ion Ursachi

Reputation: 41

I know this is an old post, but I've also been struggling with it recently. Here is my solution:

@(Html.Kendo().Grid<GridModel>()
  .Name("GridName")
  .Filterable(settings => settings
      .Mode(GridFilterMode.Menu)
      .Extra(true))
  .Events(e => e.FilterMenuInit("filterMenuInit"))
  .Columns(...)
  .DataSource(...))
<script>
    function filterMenuInit(e) {
        if (e.field === 'MyField') {
            var header = e.sender.thead.find('th[data-field=MyField]'),
                filterMenu = header.data('kendoFilterMenu'),
                filterModel = filterMenu['filterModel'];

            //change the logic operator
            filterModel.set('logic', 'or');

            //change the first operator to "greater than or equal to"
            filterModel.set('filters[0].operator', 'gte');

            //change the second operator to "less than or equal to"
            filterModel.set('filters[1].operator', 'lte');
        }
    }
</script>

Find more here.

Upvotes: 0

Pyrobri
Pyrobri

Reputation: 61

You can also do this on a per column basis on your grid definition (MVC):

cols.Bound(m => m.xxx).Filterable(f=> f.Cell(cell => cell.Operator("or")));

Upvotes: 1

Atanas Korchev
Atanas Korchev

Reputation: 30671

This can be done via the filterMenuInit event:

 /* grid configuration snip */
.Events(e => e.FilterMenuInit("filterMenuInit"))
 /* grid configuration snip */

 <script>
 function filterMenuInit(e) {
      e.container
         .find("select.k-filter-and")
         .data("kendoDropDownList")
         .value("or");
 }
 </script>

Here is a live demo: http://jsbin.com/etItEpi/1/edit

Upvotes: 5

Related Questions