Multiple DataTables on a page - reset button for each table

Multiple DataTables on a page - reset button for each table

schmolzpschmolzp Posts: 4Questions: 1Answers: 0
edited June 2014 in Free community support

Hi Allan,
Great plugin! So what I have so far is multiple dataTables on a page. Each table is adding a reset table button. However, whenever you click on one, it will reset all of them. How would I make each reset button clear the table it corresponds with based on how many dataTables are on that page? Not sure of the best way to do this.
Thanks so much! I'm not that great with javascript, but here is what I have so far:

        /* Initialize Data Table Sorter */
        $(function() {
            $('table.display').dataTable({
                "bAutoWidth": false,
                "sDom": 'Rf<"reset-table">rti',
                "aoColumnDefs": [
                    { bSortable: false, aTargets: ['noSort'] }  // Disable sorting on columns marked as so
                ],
                "oLanguage": {
                    "sSearch": "I'm interested in:"
                },
                "iDisplayLength"    : -1
            });

            var span = []
            var oTable = []
            var input = []

            for (i=0; i<= 10; i++) {
                span[i] = '<span id="reset-btn' + i +'"><a href="#">Reset Table</a></span>';

                oTable[i] = $('#DataTables_Table_'+ i).dataTable();
                input[i] = $("#DataTables_Table_" + i + "_filter input");

                input[i].attr("placeholder", "type keywords to filter table results");
                $(".reset-table").html(span[i]);
                $("#reset-btn" + i).click( function(event) {
                    event.preventDefault()
                    input[i].val('').keyup();
                    oTable[i].fnSortNeutral();
                });
            }


            $.fn.dataTableExt.oApi.fnSortNeutral = function ( oSettings )
            {
                /* Remove any current sorting */
                oSettings.aaSorting = [[ 0, "asc" ]];

                /* Sort display arrays so we get them in numerical order */
                oSettings.aiDisplay.sort( function (x,y) {
                    return x-y;
                } );
                oSettings.aiDisplayMaster.sort( function (x,y) {
                    return x-y;
                } );

                /* Redraw */
                oSettings.oApi._fnReDraw( oSettings );
            };

        });
This discussion has been closed.