customized filter range of numbers datatables

Question

customized filter range of numbers datatables

Navigation

#1 by (0 votes)

0

I'm trying to make a custom filter by selecting a range of numbers with the datatables and only works once. I tried in many ways and none worked and searching I found nothing, so I come here to ask for your help.

<select id="filtro1">
            <option value="">Selecione</option>
            <option value="1-10">1-10</option>
            <option value="11-16">11-16</option>
            </select>

Here is jquery

$(document).ready(function() {
    $('#filtro1').on("change", function(){
        var valor = $(this).val();      
        var arr = valor.split('-');

            $.fn.dataTable.ext.search.push(
    function( settings, data, dataIndex ) {
        var min = parseInt( arr[0], 7 );
        var max = parseInt( arr[1], 7 );
        var age = parseFloat( data[7] ) || 0; // use data for the age column

        if ( ( isNaN( min ) && isNaN( max ) ) ||
             ( isNaN( min ) && age <= max ) ||
             ( min <= age   && isNaN( max ) ) ||
             ( min <= age   && age <= max ) )
        {
            return true;
        }
        return false;
    }
);
table.draw();           

    });

var table = $('#classificacao').DataTable({
        "lengthMenu": [ [10, 25, 50, 100, -1], [10, 25, 50, 100, "Todos"] ],
        "processing": true,     
        "oLanguage": {
            "sUrl": "../busca/pt-br.txt"
        },
        "columnDefs": [
            {
                "targets": [ 7 ],
                "visible": false
            }
        ]
    });
});

I took this example using input type text

link

Thanks in advance for any help.

jquery jquery-datatables

asked by anonymous 17.05.2017 / 05:48

1 answer

I would like a user to enter a single border of markers on the map How to add custom methods to all spring data services

score 0 · Answer 1

I come here with the problem solved and to possibly help other people.

        $('#filtro1').on("change", function(){
        var valor = $(this).val();      
        var arr = valor.split('-');

        if ( $.fn.dataTable.ext.search.length>0 ) {
    $.fn.dataTable.ext.search.pop(); //<--here
  }

            $.fn.dataTable.ext.search.push(
    function( settings, data, dataIndex ) {
        var min = parseInt( arr[0], 7 );
        var max = parseInt( arr[1], 7 );
        var age = parseFloat( data[7] ) || 0; // use data for the age column

        if ( ( isNaN( min ) && isNaN( max ) ) ||
             ( isNaN( min ) && age <= max ) ||
             ( min <= age   && isNaN( max ) ) ||
             ( min <= age   && age <= max ) )
        {
            return true;
        }
        return false;
    }
);
table.draw();           

    });