Global Search at the top of my table not working

aebrey

Greetings,

I have built a table using json data (see the link below). The data loads and I can sort the columns but everytime I try to enter anything into the search I get a message saying nothing was found. What can I do to remedy this? I am not getting any errors in the console.

Site: https://nerdy-droid.github.io/
Repo: https://github.com/Nerdy-Droid/Nerdy-Droid.github.io

Thanks in advance!

colin

Hi @aebrey ,

The problem is this code here:

        $( 'input', this.footer() ).on( 'keyup change', function () {
            if ( that.search() !== this.value ) {
                that
                    .search( this.value )
                    .draw();
            }
        } );

This means that when you search for anything, say the letter 'f', that search is applied to every column. You can tell in the console by typing something like:

$('#example').DataTable().column(1).search()

it displays the same search for all columns. I think your intention was to have an input element in the footers - if so, take a look at the example here, it's along the lines of what you want.

Cheers,

Colin

aebrey

Thanks! I removed the footer search boxes for now and the search box works great.