Grid filter "and" & "or" dropdown order

5 posts, 1 answers
  1. Jordi
    Jordi avatar
    3 posts
    Member since:
    Oct 2014

    Posted 08 May 2017 Link to this post

    Inside the filter of the grid I need to change the order of the items "And" & "Or" inside the list to show "Or" by default.

    I tried declaring the grid with jquery but I can only change the text of the item: 

    $("#testgrid").kendoGrid({

                columns: [
                    {field: "name"},
                    {field: "age"}],
                dataSource:[
                {name: "John", age:"30"},{name: "Mike", age:"32"}],
                filterable:{
                    messages:{
                        or: "filterOr",

                        and: "And"

                    }
                }
            })

    Is it possible to change the order of the items?

     

    Thanks

  2. Preslav
    Admin
    Preslav avatar
    571 posts

    Posted 09 May 2017 Link to this post

    Hello Jordi,

    To achieve the desired result, I would suggest handling the filterMenuInit event, selecting the logic dropdown and changing its value.

    http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-filterMenuInit

    For example, the code might look like this:

    filterMenuInit: function(e) {
        var logicDropDown = e.container.find("select:eq(1)").data("kendoDropDownList");
        logicDropDown.value("or");
        logicDropDown.trigger("change");
    }

    Additionally, a runnable Dojo is available here: http://dojo.telerik.com/OqAJuq

    I hope this helps.


    Regards,
    Preslav
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Jordi
    Jordi avatar
    3 posts
    Member since:
    Oct 2014

    Posted 09 May 2017 in reply to Preslav Link to this post

    Perfect, thank you!

    Is there any way to do that in mvc?

    Regards,

  4. Answer
    Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    995 posts

    Posted 11 May 2017 Link to this post

    Hello Jordi,

    The approach will be the same for the Kendo UI Grid for ASP.NET MVC. The only difference is the wrappers events syntax: 

    http://docs.telerik.com/aspnet-mvc/api/Kendo.Mvc.UI.Fluent/GridEventBuilder#methods-FilterMenuInit(System.Func<System.Object,System.Object>)

    @(Html.Kendo().Grid<ProductViewModel>()
      .Name("grid")
      .Events(events => events
        .FilterMenuInit("onfilterMenuInit")
        )
    )
     
    <script>
    function onfilterMenuInit(e){
     var logicDropDown = e.container.find("select:eq(1)").data("kendoDropDownList");
     logicDropDown.value("or");
     logicDropDown.trigger("change");
    }
    </script>

    Regards,
    Alex Hajigeorgieva
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Jordi
    Jordi avatar
    3 posts
    Member since:
    Oct 2014

    Posted 12 May 2017 in reply to Alex Hajigeorgieva Link to this post

    Thank you a lot Alex, that solves my problem.
Back to Top