Grid Column filtering (menu type with checkbox) how to change to "contains" logic

[Alex E]

Hi

This question is in reference to Grid Column Filtering (using "Menu Type" with checkboxes):

https://ej2.syncfusion.com/vue/demos/#/material/grid/grid-overview.html

In above link when you click filter icon of "Employee Name"  and then start typing few characters, the pop-up dropdown list is filtered using "BeginsWith" logic.

How can I change it so it filters using "contains" logic? (please note, I'm not referring to grid filtering itself, but rather to filtering of column dropdown options list)

Must be something simple but could not find it anywhere in documentation

Thanks

Alex

[Pavithra Subramaniyam]

Hi Alex, 

 

Greetings from Syncfusion support.   

   

You can achieve your requirement by overriding the operator inside the actionBegin event for ‘filtersearchbegin’ request. Please refer to the below code example, Documentation and sample link for more information. 

 

<template> 

  <div id="app"> 

    <ejs-grid id="Grid" ref="grid" allowFiltering=true :filterSettings='filter' :actionBegin='actionBegin' :dataSource="data"> 

      <e-columns> 

        <e-column field="OrderID" headerText="Order ID" width="90"></e-column> 

        <e-column field="CustomerID" headerText="Customer ID" format="C2" width="90"></e-column> 

        <e-column field="ShipCity" headerText="Telefon" width="150" textAlign="Center"></e-column> 

      </e-columns> 

    </ejs-grid> 

  </div> 

</template> 

 

<script> 

.  .  . 

 

export default { 

  data() { 

    return { 

      data: data, 

      filterSettings:{type:"CheckBox"} 

    } 

      }, 

  methods: { 

    actionBegin:function(e){ 

       if(e.requestType === 'filtersearchbegin' && e.columnName === 'CustomerID'){ 

          e.operator = 'contains'; 

     } 

    } 

  }, 

 

  provide: { 

    grid: [Page, Filter] 

  } 

}; 

</script> 

 

 

Documentation: https://ej2.syncfusion.com/vue/documentation/api/grid/#actionbegin 

 

Sample               : https://codesandbox.io/s/checkbox-search-operator-mms2d 

 

Please get back to us if you need further assistance. 

 

Regards, 

Pavithra S. 

[Alex E]

Thanks Pavithra!

[Dhivya Rajendran]

Hi Alex, 

We are happy that the provided solution was helpful to achieve your requirement. Please get back to us if you need further assistance from us. 

Regards, 

R.Dhivya