1. Home
  2. Forum
  3. JavaScript - EJ 2
  4. Allow Case insensitive search in AutoComplete while filtering using both text and value

Allow Case insensitive search in AutoComplete while filtering using both text and value

Hi,

I followed the instructions here: https://ej2.syncfusion.com/javascript/documentation/auto-complete/how-to/filter/ to use autocomplete on text and value. This works great except that the search is not case-insensitive for either of the fields. For example, if I type the search as au instead of Au, it does not find anything.

I thought the predicate operator 'contains' by default was case-insensitive.

Can you please look into it?

Thanks!


6 Replies 1 reply marked as answer
UD UdhayaKumar Duraisamy Syncfusion Team October 20, 2022 04:27 PM UTC

Hi Tera,


We are validating the requirement. We will update the further details in one business day (21st October 2022).


Regards,

Udhaya Kumar D


UD UdhayaKumar Duraisamy Syncfusion Team October 23, 2022 04:23 PM UTC

Hi Tera,


We suggest you use the ignoreCase property for your requirement. When the ignoreCase property is set to ‘false’, consider the case-sensitive on performing the search to find suggestions.


filtering: function (e) {

    e.preventDefaultAction = true;

    var predicate = new ej.data.Predicate(

      'Name',

      'contains',

      e.text,

      (ignoreCase = true)

    );

    predicate = predicate.or('Code', 'contains', e.text, (ignoreCase = true));

    var query = new ej.data.Query();

    query = e.text != '' ? query.where(predicate) : query;

    e.updateData(searchData, query);

  },

 

Documentation : https://ej2.syncfusion.com/javascript/documentation/api/auto-complete/#ignorecase


Sample : https://stackblitz.com/edit/vzatmv?file=index.js


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Regards,

Udhaya Kumar D


Marked as answer
JA Joseph A Whelan October 24, 2022 01:01 PM UTC

Thank  you. This worked!


UD UdhayaKumar Duraisamy Syncfusion Team October 26, 2022 04:53 AM UTC

Hi Tera,


We are glad that your requirement has been fulfilled on your end. We are always happy to assist you.


Regards,

Udhaya Kumar D


MS Mustafa Soner Acar December 17, 2022 11:39 PM UTC

Hi,

How to add ignoreAccent alongside with ignoreCase to this case?


UD UdhayaKumar Duraisamy Syncfusion Team December 19, 2022 05:56 AM UTC

You can use the ignoreAccent property to meet your requirements. For more information, please refer to the sample and documentation below.


var atcObj = new ej.dropdowns.AutoComplete({

  dataSource: searchData,

  fields: { value: 'Code', text: 'Name' },

  placeholder: 'e.g. Node.js Succinctly',

  ignoreAccent: true,

 

  filtering: function (e) {

    e.preventDefaultAction = true;

    var predicate = new ej.data.Predicate(

      'Name',

      'contains',

      e.text,

      (ignoreCase = true)

    );

    predicate = predicate.or('Code', 'contains', e.text, (ignoreCase = true));

    var query = new ej.data.Query();

    query = e.text != '' ? query.where(predicate) : query;

    e.updateData(searchData, query);

  },

});

atcObj.appendTo('#books');

 


Documentation : https://ej2.syncfusion.com/angular/documentation/auto-complete/filtering/#diacritics-filtering 


API – Reference : https://ej2.syncfusion.com/javascript/documentation/api/auto-complete/#ignoreaccent


Sample : https://stackblitz.com/edit/vzatmv-ann7vg?file=index.js


Loader.
Up arrow icon