How to start search with the first letter?

FRS4002

I have this test case http://live.datatables.net/peyudomo/1/edit
and I need to search from the first letter. I did what is said here https://datatables.net/forums/discussion/45526/search-start-with-letter
which is adding
$('input[type = search]').on( 'keyup', function (e) { var regExSearch = '\\b' + this.value; //var regExSearch = '^' + this.value; table.search(regExSearch, true, false).draw(); });
but still it is not working

kthorngren

Maybe I don't understand what you want bu it seems to work for me.
http://live.datatables.net/peyudomo/2/edit

I type b I get this:

Bradley Greer
Brenden Wagner
Brielle Williamson
Bruno Nash

Type br the same result. The type bru I see only Bruno Nash. Is that not what you want?

If you watch closely will will see a flash of extra rows between characters type. Thats because the event handler Datatables creates is running too. You see the results of its search then your event handler runs to modify the search. You need to disable the Datatables handler if you want to create a custom one from the default search input, like this:

$('.dataTables_filter input').off();

http://live.datatables.net/turameyu/1/edit

If this doesn't help then please provide the exact steps needed to show the problem.

Kevin

FRS4002

@kthorngren I really don't know what's going on, in the test case the search functionality is working perfectly fine, but in my real project not working... It always giving me no matching records... It will work if I remove the regex code but it will not start the search from the first letter... What should I do?

kthorngren

You can use the browser's debugger tool or console.log statements to debug the code. Or post a link to your page or a test case showing the issue. Maybe update the test case with an example of the data you are having a problem with. Without seeing the problem there is not much we can suggest.

Kevin

FRS4002

@kthorngren Ok, I've found something... I tried to replace this code
var regExSearch = '^' + this.value;
with this code
var regExSearch = '//b' + this.value;
The search functionality and first letter search 99% worked, but if I have the data in Arabic language, it says no matching records even if that regex is "^", unless I remove the regex code the search functionality will work but then it will not start the search from the first letter... I don't know why that is happening in Arabic language...

kthorngren

Are you looking for the first letter type to match the first letter in the cell or the first letter of any word in the cell?

Please update the test case with the data your are having issues with and provide specifics about what you are looking for.

Kevin

FRS4002

@kthorngren First of all, I don't understand this "Are you looking for the first letter type to match the first letter in the cell or the first letter of any word in the cell?" What's the difference? Can you give examples? Second, here is an example, I want to search for Name column or Age column http://live.datatables.net/pamebopo/1/edit
with "^" I can't search for age... It seems that it doesn't recognize numbers... If I type 6 it says no matching records, whereas if I replace "^" with "\\b" like this
http://live.datatables.net/minotagu/1/edit
I can search for age, it recognizes numbers... But it ruins the search for letters. The search now doesn't start from the first letter. So, I need the search to start from the first letter either Arabic or English, or first number. Second issue, that I didn't find a solution for it that in test cases searching for Arabic works but in my real project doesn't work... It gives me no matching records.

kthorngren

The way Datatables search works is it looks basically combines the whole row into a search string. So the ^ to match at the beginning of the string will work with only the first column. If you want to match the first character of each column then you will need to use a search plugin. Go back to this example in your other thread and look at this loop:

      // Build regex expression
      let re = new RegExp( '^' + search, 'i' );

      // Look through each column to find a match
      for (i=0; i<data.length; i++) {

        // If any column matches then show row
        if ( re.test( data[i] ) ) {
          found = true;
        }

      }

That is how you can match the first letter for each column.

Kevin

FRS4002

@kthorngren Thanks Kevin, I added the search plugin code, but still it does not show rows that start with first letter/number
http://live.datatables.net/wofakiju/1/edit

kthorngren

You need to make it a search plugin not an event handler. Like this:
http://live.datatables.net/wofakiju/2/edit

Kevin

FRS4002

@kthorngren Oh my god! That's the best answer! Now I know how to make a search plugin! Searching English letters, numbers and also Arabic letters is working now! I highly recommend this answer to other posts that has the same question like this
https://datatables.net/forums/discussion/45526/search-start-with-letter
since the answer above does not work in Arabic language. I suggest @allan to manage this answer/question and approve your answer as the best answer for this question and other related questions! Really thanks!

kthorngren

One problem with the \b boundary search, from the thread you linked to is that it will match words in the middle of the cell. Take for instance one of your examples (modified slightly to search all columns):
http://live.datatables.net/pamebopo/4/edit

Type con and you will see it matches Financial Controller. This may be ok depending on the requirements. Using the \b instead of looping through each column in the search plugin might be more efficient. and show better performance with large data sets.

I'm not familiar with Arabic but maybe this SO thread might be of interest regarding why \b might not work.

Kevin