CODEWITHSUNDEEP
javascriptregexdatatables
GrantD71
GrantD71

Reputation: 1875

DataTables regex search not working as expected for exact match

I want to search a column of my DataTable for an exact value and return only the row that contains that value. I've read that the way to do this is to do a regex search for the specific value, however when I attempt this an exact regex search returns nothing.

For example in the following table I want to return only the row that contains an id=0

<table id="searchTable" class="formTable display dataTable" cellspacing="0" style="width: 100%;">
    <thead>
        <tr>
            <th>id</th>
            <th>Position</th>
            <th>Office</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>0</td>
            <td>Accountant</td>
            <td>Tokyo</td>
        </tr>
        <tr>
            <td>1</td>
            <td>Chief Executive Officer (CEO)</td>
            <td>London</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Junior Technical Author</td>
            <td>San Francisco</td>
        </tr>
        <tr>
            <td>10</td>
            <td>Software Engineer</td>
            <td>London</td>
        </tr>
        <tr>
            <td>20</td>
            <td>Software Engineer</td>
            <td>San Francisco</td>
        </tr>
    </tbody>
</table>

When the document is loaded I attempt to use the search api as described here.

var table = null;
$(document).ready(function(){
    table = $('#searchTable').DataTable( {
        "sPaginationType": "full_numbers",
        "iDisplayLength": 5
    } );

table.columns(0).search('/0/',true,false).draw();

} );

JS fiddle showing the regex failing

Upvotes: 0

Views: 6507

Answers (2)

FN90
FN90

Reputation: 421

In case somebody else face this problem. In my case the problem was related to searching for string characters that have special meaning in a regular expression (eg. "AC (JLHA2) - GB/T1179-2008" will give nothing even if the data exists in the table).

I was able to fix this by using $.fn.dataTable.util.escapeRegex() to escape all special characters.

Here is the fix:

var table = null;
    $(document).ready(function(){
        table = $('#searchTable').DataTable( {
            "sPaginationType": "full_numbers",
            "iDisplayLength": 5
        } );

        // Escape the expression so we can perform a regex match    
        var val = $.fn.dataTable.util.escapeRegex('AC (JLHA2) - GB/T1179-2008');
        table.columns(0).search(val ? '^' + val + '$' ; '', true, false).draw();        
    } );

Upvotes: 1

GrantD71
GrantD71

Reputation: 1875

The trick was to put the start character symbol '^' before the value being searched on and end character symbol '$' after the value. Without giving these two symbols the regex will always return nothing.

Fixed portion:

var table = null;
$(document).ready(function(){
    table = $('#searchTable').DataTable( {
        "sPaginationType": "full_numbers",
        "iDisplayLength": 5
    } );

table.columns(0).search('^0$',true,false).draw();

} );

Upvotes: 3

Related Questions