Kendo jQuery Grid , Get text on dropdown filter

4 posts, 0 answers
  1. Derian
    Derian avatar
    4 posts
    Member since:
    Aug 2020

    Posted 31 Aug 2020 Link to this post

    How can i get the text field of a dropdown in the column filter?

    I have the following example : https://dojo.telerik.com/izUviSID/2

  2. Petar
    Admin
    Petar avatar
    472 posts

    Posted 02 Sep 2020 Link to this post

    Hi Derian,

    The way the data is structured in the provided example is not exactly what the Grid expects to receive as input data. Actually, it is displaying correctly the data provided to its dataSource.

    To implement the targeted functionality do display the corresponding text in the Grid's menu we can use the approach discussed in this forum thread. Using the discussed columns.filterable.itemTemplate configuration here is a Dojo that demonstrates the targeted functionality for the 'Brand' column. 

    To implement the targeted functionality, there is the following definition for the 'Brand' column:

    filterable:{
          multi:true,
          itemTemplate: function(e) {
               return "<label><input type='checkbox' name='" + e.field + "' value='#= data.brandId#'/>#= getBrand(brands, data.brandId)#</label><br>" 								           }
    }

    Where the getBrand function is defined as follows:

      function getBrand(arr, brand){
          var result; 
        		$.each(arr, function(index, elem){
              	if(elem.brandId == brand){
                		result = elem.name;
                } 
            })
          if(result == undefined) {
          		result = "Select all"
          };
          
          return result;
        }

    I hope the provided example will help you implement the targeted functionality in your application. 

    Regards,
    Petar
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive , special prizes and more, for FREE?! Register now for DevReach 2.0(20).

  3. Derian
    Derian avatar
    4 posts
    Member since:
    Aug 2020

    Posted 02 Sep 2020 in reply to Petar Link to this post

    Thank you so much Petar
  4. Petar
    Admin
    Petar avatar
    472 posts

    Posted 04 Sep 2020 Link to this post

    Hi Derian,

    You are welcome! I am happy that the suggested approach has helped you implement the targeted functionality.

    Regards,
    Petar
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive , special prizes and more, for FREE?! Register now for DevReach 2.0(20).

Back to Top