Add search boxes to datatable.

I have tried loads of different ways to get this to work.

I am using this link

https://www.datatables.net/release-datatables/examples/api/multi_filter_select.html

What is the correct syntax to get this working please?

Cheers

Steve Warby

var editor; // use a global for the submit and return data rendering in the examples
var selectedQuoteID;
var table;
// add filter boxes

btnGetData.onclick=function(){

        $("#DataTable1").dataTable().fnDestroy();
        $('#DataTable1').empty();


     table = $('#DataTable1').DataTable( {

        "order": [[0, 'desc']],
        dom: "Bfrtip",
        autoWidth : true,
        responsive: true,
        ajax: "http://toolfolks.com/surplusAdmin3/php/upload-many.php",
        columns: [
            { data: "quotes.quoteID" , width : '25px', title : 'Quote No'},
            { data: "quotes.custID" , width : '25px', title : 'Cust No'},
            { data: "quotes.quoteDate" , width : '25px',  title : ' Date'},
            { data: "quotes.quoteTitle" , width : '150px',  title : ' Title'},
            { data: "quotes.notes" , width : '150px',  title : ' Notes'},
            { data: "quotes.notesInternal" , width : '150px',  title : ' Notes Internal'},
            { data: "sites.name" },
            {
                data: "files",
                render: function ( d ) {
                    return d.length ?
                        d.length+' image(s)' :
                        'No image';
                },
                title: "Image"
            }
        ],
        select: true

    } );

    // Apply the search
    table.columns().every( function () {
        var that = this;

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

btnAddSearch.onclick=function(){

        $('#DataTable1 tfoot th').each( function () {
        var title = $(this).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );
    //var table2 = $('#DataTable1').DataTable();




    table.columns().every( function () {
        var that = this;

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

}