Global custom search filter

Global custom search filter

bola2apibola2api Posts: 4Questions: 2Answers: 0

Hi all, I'm trying to create a global app to act as a custom search filter. I've test it on individual input tag and datatable and its working. Could you guys point it to me what when wrong? Or is there any restriction when I'm trying to use this approach?

$('[data-toggle="datatable"]').each(function () {
    var tableId = $(this).attr('id');
    var table = $('#' + tableId).DataTable({});
    var input = $('#' + tableId + 'input');

    input.on('keyup', function () {
        var value = input.val();
        table.search(value).draw();
    });

    $(input, table.table().container()).on('search.dt', function () {
        var value = input.val();
        if (value === '') {
            table.search('').draw();
        }
    });
});

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    Could you guys point it to me what when wrong?

    You haven't said what went wrong? :)

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Colin

  • bola2apibola2api Posts: 4Questions: 2Answers: 0

    Hi Colin, thanks for replying. Please have a look at this
    https://live.datatables.net/lixeboga/1/edit

    What I'm trying to achieve is to create a global function for custom search filter. You can try to search in the input tag but nothing is being trigger.

    Sorry I'm very new to Javascript language

  • allanallan Posts: 63,494Questions: 1Answers: 10,470 Site admin
    Answer ✓

    var input = $('#' + tableId + '_input '+ 'input');

    Is the issue - it isn't matching anything. Your input element has an id of example1_input, but the selector is matching that and then picking desendents of input elements, of which there aren't any.

    Use:

    var input = $('#' + tableId + '_input');
    

    And it will pick the correct element.

    Allan

  • bola2apibola2api Posts: 4Questions: 2Answers: 0

    Ohh silly me.

    Thanks a lot Allan!
    You too Colin!

Sign In or Register to comment.