Min-Max filter does not work when other functions are loaded

Question

01) I have A JSON URL and I load the data into an HTML table dynamically through an external .js file.

02) I have a filter for the name (first column). (It works fine)

03) I have a multiplication function for each row. (It works fine)

04) I have a min-max function for the 3d column. (It does not work although it used to work).

The link is here : LINK

The code is shown here :

function minmax() {

    filters();
    $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
        return parseFloat(data[2]) >= parseFloat($('#counter-low').val() || data[2]) &&
            parseFloat(data[2]) <= parseFloat($('#counter-high').val() || data[2]);
    });

    var table = $('table').DataTable();
    $('#counter-low, #counter-high').on('keyup', table.draw);
}

where I am also calling the filters function inside. I cannot figure out why it is not working.

UPD : I changed the order of the calls in the header and it works better now. But still not working 100%.

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="js/jquery.min.js"></script>
  <script src="js/jquery.multiselect.js"></script>
  <script type="text/javascript" language="javascript" src="js/jquery.dataTables.min.js"></script>
  <script type="text/javascript" language="javascript" src="js/allinone.js"></script>

Answer 1

i can't follow where dataTable should come from but in fact, neither $.fn.dataTable seems to be available or the command $('table').DataTable();

maybe you are missing a script that gives this functionality but if you just want to hide the rows, you could use something like following in min/max (currently its jsut min - i did not complete it - just tested it):

$('table').children('tbody').children('tr').filter(
function (key, element) {
    if (
        parseFloat($(element).children(':nth-child(3)').text())
         < parseFloat($('#counter-low').val())
        ||
        parseFloat($(element).children(':nth-child(3)').text())
         > parseFloat($('#counter-high').val())
    )
        return true;
    else
        return false;
}).css('display', 'none');

Answer 2

Check the order where the scripts are executed, if it was working, probably you will note it faster. Check also for console.log() errors int the web console. And by the way, the language attribute in <script> tags has been deprecated for a long time, and should not be used. Not even type is necessary on these days. Also, you have two jQuery versions.

<script src="js/jquery.dataTables.min.js"></script>