Twitter Bootstrap Question posted in

yadcf Filter not working – Twitter bootstrap

I’m currently using this with:

jQuery JavaScript Library v2.2.4
jQuery UI – v1.12.0 – 2016-07-08

I’ve used the following to init the table

<!-- Datatables Scripts -->
<script src="js/jquery.dataTables.js"></script>
<script src="js/jquery.dataTables.yadcf.js"></script>
<script type="application/javascript">
    $(document).ready(function() {

        addTest();

        var testTable;

        testTable = $('#datatable').DataTable({
            stateSave: true,
            orderable: true,
            'order': [[ 0, 'desc' ]],
            searching: false
        });

        yadcf.init(testTable, [{
            column_number: 1
        }]);

    });
</script>

When I load the page, the column I am looking to have filter shows, the drop down has the values. However when I choose an item in the drop down, nothing happens. It shows that it is selected and that is it. Is there an issue with the jQuery and jQuery-UI that I am using that causes this to not refresh the table? This is exactly what I need. I’m using twitter bootstrap as well if that matters. I’ve also went to the dataTables site and included everything in one file, included those files. The dataTables themselves work and show but its the filter drop down not actually refreshing the table. Thank you!

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Well it seems I posted this to quick. Went through and reviewed and realized I turned off searching. Removed the searching: false and it works now. Originally I turned off searching because the search box did not play well on mobile.


  2. 0

    For those who want the filtering of yadcf without the search bar, you can’t just disable sorting.
    The solution I found was to keep the searching value at true (default) and use the dom: initialization parameter to skip (f)iltering option.

    ex)

    $('#tableId').DataTable({
    dom: 'Bti',
    //Note, this maintains (B)uttons, then the (t)able, then the (i)nfo section - skipping the (l)ength, (f)iltering, (p)agination, and p(r)ocessing which I didn't want.
    // ... other initialization ...
});

    DataTables – DOM Reference Page

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search