Jquery Data Table Sorting and filtering records

问题

Using Jquery DataTable, I managed to create drop downs on top of each column having unique values for filtration. But the problem is when i click on the drop down sorting also gets activated. I only want to sort records when user clicks on "sorting arrow icons". Is there any way to cancel sorting event while user is clicking onto the drop down, but keep it enabled so that user can click on sorting icons to sort the data ? Here is a link to Data Table Live http://live.datatables.net/ribezoho/1/edit

Please let me know

This is my code

$(document).ready(function() {
$('#example').DataTable( {
    initComplete: function () {
        var api = this.api();

        api.columns().indexes().flatten().each( function ( i ) {
            var column = api.column( i );
            var title = $('#example thead th').eq(i).text();
            var select = $('<select><option value="">'+title+'</option></select>')
                .appendTo( $(column.header()).empty() )
                .on( 'change', function () {
                    var val = $.fn.dataTable.util.escapeRegex(
                        $(this).val()
                    );

                    column
                        .search( val ? '^'+val+'$' : '', true, false )
                        .draw();
                } );

            column.data().unique().sort().each( function ( d, j ) {
                select.append( '<option value="'+d+'">'+d+'</option>' )
            } );
        } );
    }
} );
} );

回答1:

Add a click handler to your <select> that calls event.stopPropagation(). This will prevent the click event from bubbling up from the <select> to the <th>.

http://live.datatables.net/ribezoho/20/edit

来源：https://stackoverflow.com/questions/27407171/jquery-data-table-sorting-and-filtering-records