How to react to invalid search regex?

How to react to invalid search regex?

schlomoschlomo Posts: 4Questions: 1Answers: 0
edited September 2020 in Free community support

Using DataTables 1.10.21

I use RegEx search in my table and I noticed that searching for an invalid RegEx, e.g. ( will throw errors in the browser console and of course the search doesn't work:

jquery.dataTables.js:4476 Uncaught SyntaxError: Invalid regular expression: /(/: Unterminated group
    at new RegExp (<anonymous>)
    at _fnFilterCreateSearch (jquery.dataTables.js:4476)
    at _fnFilter (jquery.dataTables.js:4396)
    at _fnFilterComplete (jquery.dataTables.js:4295)
    at HTMLInputElement.searchFn (jquery.dataTables.js:4202)
    at HTMLInputElement.dispatch (jquery.js:5429)
    at HTMLInputElement.elemData.handle (jquery.js:5233)

I would like to provide visual feedback to the user about this issue, e.g. turning the background of the search field red. I also would like to add some helpful text about valid search terms.

My problem is that I cannot figure out how to setup an event listener to catch this problem or alternatively to catch search attempts and check myself for valid RegEx and then let it happen or reject the input.

Question: How to catch search attempts and manipulate them before they happen and before DataTables tries to construct the RegEx from it?

Thanks a lot for this great software, I really enjoy using it and managed to solve all my problems myself so far.

You can see the problem in action at https://chromebooks-in-deutschland.de/#( (sorry, heavily minified).

Answers

  • kthorngrenkthorngren Posts: 20,139Questions: 26Answers: 4,734

    Have you tried try/catch? For example:
    http://live.datatables.net/qekewoza/1/edit

    You can see the problem in action at https://chromebooks-in-deutschland.de/#( (sorry, heavily minified).

    Its tough to debug minimized code. Can you post a link to a non-minimized version or create a test case showing the issue?
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Also please provide the steps to recreate the error.

    Kevin

  • schlomoschlomo Posts: 4Questions: 1Answers: 0

    Thanks, that is a great idea: http://live.datatables.net/xurayoce/2/edit is a demo of the problem and it helped me to understand more about it. The problem appears only if a manual search happens after a RegEx API search and that is what I want to fix.

    Please note that the live.datatables.net JS console does not show the details of the error, you'll see it in the browser JS console.

  • schlomoschlomo Posts: 4Questions: 1Answers: 0

    Another demo for the problem at http://live.datatables.net/posupuvu/17/edit?js,console,output

    It clearly shows that this is an internal DataTables problem: When RegEx search is active an inalid RegEx search term crashes the code.

    I would like to know how to catch that to be able to give the user feedback and to prevent the console filling up with errors.

  • kthorngrenkthorngren Posts: 20,139Questions: 26Answers: 4,734

    Thanks for the example! I thought you were using your own search input in the first example you provided. That is definitely one way to catch the errors is to use your own input along with the search API.

    @allan or @colin can let you know if its possible to catch the exception when using the default search input.

    Kevin

  • schlomoschlomo Posts: 4Questions: 1Answers: 0

    I updated http://live.datatables.net/posupuvu/19/edit to show that the DT javascript crash also prevents the normal input event so that I cannot use that to react to wrong input:

  • allanallan Posts: 61,431Questions: 1Answers: 10,048 Site admin

    If you are calling search(), then as Kevin says, a try/catch would be the way to do it (like in your example). But if you want to catch the error for the end user typing the regex, then you'd need to have your own input element which calls the search() method on the input event.

    The only issue I can see with that, is that you can't throw up a modal or something to say that the regex is bad - you'd want to just perhaps turn it red, to allow the user to keep typing. If you've ever used Wireshark, that's how their search works.

    Here is a little example: http://live.datatables.net/boqawiyi/1/edit .

    Allan

This discussion has been closed.