jquery (server side) search and sorting using ajax

Question

I tried to create search and sort from live URL using Ajax, i used do search function and i managed to retrieve the data from the URL.

I am showing Ajax response in select options as below code. I want to sort the select options in order of values (level values),the values are retrieved randomly in the results.

How can I combine search and sort function for that?I used lots of tutorials to do that. To anyone who knows please help me to do that. Thank you.

Please provide a solution to automate sort data with the current search function on values basis (by level). Sample of the current results like:

So far I have this code:

function doSearch() {
    $.Ajax({
          URL: 'https://live.ksmobile.net/live/BOYS',
          data: {
            page_size: 10,
            page_index: current_page
          },
          cache: false,
          type: 'GET',
          datatype: 'JSON',
          success: function(r) {
              var max = $('#limit').VAL();

              if (r.data.video_info.length < max) max = r.data.video_info.length;

              for (index = 0; index < max; index++) {
                var entry = r.data.video_info[index];
                var level = parse Int(entry.level);

                if ((level > $('#min').val()) && (level < $('#max').val())) {
                  count++;
                  var HTML = '<div class="entry ' + '"><h="' + entry + '">';
                  HTML += '<h3>Level: <span>' + entry.level + '</span> <span>' + entry.name + '' + '</span>id:<span>' + entry.heat;
                  HTML += '</div>';
                  $('#main').append(HTML);
                }
              }

Answer 1

You could write a custom sort function which would look something like:

function sortResults(array) {
    array.sort(function(x, y) {
        if (parseInt(x.level, 10) < parseInt(y.level, 10)) {
            return -1;
        }
        if (parseInt(x.level, 10) > parseInt(y.level, 10)) {
            return 1;
        }
        return 0;
    });
}

and then call it before your for loop:

sortResults(r.data.video_info);

You could also use a library like lodash to save some trouble and then use:

r.data.video_info = _.sortBy(r.data.video_info, item => {
    return _.parseInt(item.level);
});