Ленивая загрузка работает для загрузки данных, но не при фильтрации - PullRequest
Новая
       5

Ленивая загрузка работает для загрузки данных, но не при фильтрации

0 голосов
/ 15 января 2020

Здесь первый скрипт написан для отложенной загрузки данных таблицы, а второй - для фильтрации с отложенной загрузкой, но второй не работает.

У меня есть отчет Codeigniter, в котором я сделал несколько фильтрация по данным таблицы. Я использую jQuery AJAX для отложенной загрузки данных. Я ожидал, что когда я получаю данные с помощью фильтра, ленивая загрузка не работает. Должен ли я использовать первый скрипт для загрузки таблицы по умолчанию и для фильтра. я в замешательстве Может кто-нибудь, пожалуйста, скажите мне, как объединить оба сценария в один сценарий для обоих. Пожалуйста, помогите. 

$(document).ready(function() {
  $('#filter').popover({
    placement: 'bottom',
    title: ('&nbsp;') + '<button type="button" class="close pull-right" data-dismiss="alert"  style="color:black;">&times;</button>',
    html: true,
    content: $('#customdiv').html()
  });

  $(document).on("click", ".popover .close", function() {
    $(this).parents(".popover").popover('hide');
  });

  var limit = 20;
  var start = 0;
  var action = 'inactive';

  function lazzy_loader(limit) {
    var output = '';
    for (var count = 0; count < limit; count++) {
      output += '<tr class="post_data">';
      output += '</tr>';
    }
    $('#load_data_message').html(output);
  }

  lazzy_loader(limit);

  function search_fields(limit, start) {
    $(".spinner").show();

    $.ajax({
      url: "<?=base_url()?>missed_call_campaign/fetch_data",
      method: "POST",
      data: {
        limit: limit,
        start: start
      },
      cache: false,
      success: function(data) {
        $(".spinner").hide();
        if (data == '') {
          $('#load_data_message').html('<p class="content-desc">No More Data Found</p>');
          action = 'active';
        } else {
          $('#load_data').append(data);
          $('#load_data_message').html("");
          action = 'inactive';
        }
      }
    });
  }

  if (action == 'inactive') {
    action = 'active';
    search_fields(limit, start);
  }

  $(window).scroll(function() {
    if ($(window).scrollTop() + $(window).height() > $("#load_data").height() && action == 'inactive') {
      lazzy_loader(limit);
      action = 'active';
      start = start + limit;
      setTimeout(function() {
        search_fields(limit, start);
      }, 100);
    }
  });
});

function subcategory() {
  var ClickedCategory = new Array();

  $('.CategoryClicked').each(function() {
    if ($(this).is(':checked')) {
      ClickedCategory.push($(this).val());
    }
  });

  $.ajax({
    type: 'POST',
    url: "<?=base_url()?>missed_call_campaign/subcategory_checkbox",
    data: {
      type: 'text',
      ClickedCategory: ClickedCategory
    },
    success: function(response) {
      $("#collapsepp").hide();
      $("#collapseqq").html(response);
    }
  });
}

function subsource() {
  var ClickedSource = new Array();
  $('.SourceClicked').each(function() {
    if ($(this).is(':checked')) {
      ClickedSource.push($(this).val());
    }
  });

  $.ajax({
    type: 'POST',
    url: "<?=base_url()?>missed_call_campaign/subsource_checkbox",
    data: {
      type: 'text',
      ClickedSource: ClickedSource
    },
    success: function(response) {
      $("#collapserr").hide();
      $("#collapsess").html(response);
    }
  });
}

function clearFilter() {
  location.reload();
}

$(document).ready(function() {
  $(document).on("click", "#data_filter", function() {
    var CheckedRep = new Array();
    var ClickedStatus = new Array();
    var ClickedType = new Array();
    var ClickedCategory = new Array();
    var ClickedSubCategory = new Array();
    var ClickedSubCategory_Filter = new Array();
    var ClickedSource = new Array();
    var ClickedSubSource = new Array();
    var ClickedSubSource_Filter = new Array();

    $('.RepClicked').each(function() {
      if ($(this).is(':checked')) {
        CheckedRep.push($(this).val());
      }
    });

    $('.StatusClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedStatus.push($(this).val());
      }
    });

    $('.TypeClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedType.push($(this).val());
      }
    });

    $('.CategoryClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedCategory.push($(this).val());
      }
    });

    $('.SourceClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedSource.push($(this).val());
      }
    });

    $('.SubSourceClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedSubSource.push($(this).val());
      }
    });

    $('.SubCategoryClicked').each(function() {
      if ($(this).is(':checked')) {
        ClickedSubCategory.push($(this).val());
      }
    });

    $('.SubCategoryChecked_Filter').each(function() {
      if ($(this).is(':checked')) {
        ClickedSubCategory_Filter.push($(this).val());
      }
    });

    $('.SubSourceClicked_filter').each(function() {
      if ($(this).is(':checked')) {
        ClickedSubSource_Filter.push($(this).val());
      }
    });

    if ((CheckedRep.length > 0) || (ClickedStatus.length > 0) || (ClickedType.length > 0) || (ClickedCategory.length > 0)
      (ClickedSource.length > 0) || (ClickedSubSource.length > 0) || (ClickedSubCategory.length > 0) ||
      (ClickedSubCategory_Filter.length > 0) || (ClickedSubSource_Filter.length > 0)) {
      var limits = 20;
      var starts = 0;
      var actions = 'inactive';

      lazzy_loading(limits);

      if (actions == 'inactive') {
        actions = 'active';
        filter_data(limits, starts, CheckedRep, ClickedStatus, ClickedType, ClickedCategory, ClickedSubCategory, ClickedSubCategory_Filter,
          ClickedSource, ClickedSubSource, ClickedSubSource_Filter);
      }

      $(window).scroll(function() {
        if ($(window).scrollTop() + $(window).height() > $("#load_data_filter").height() && actions == 'inactive') {
          lazzy_loading(limits);
          actions = 'active';
          starts = starts + limits;
          setTimeout(function() {
            filter_data(limits, starts, CheckedRep, ClickedStatus, ClickedType, ClickedCategory, ClickedSubCategory, ClickedSubCategory_Filter,
              ClickedSource, ClickedSubSource, ClickedSubSource_Filter);
          }, 100);
        }
      });
    }
  });

  function lazzy_loading(limits) {
    var output = '';
    for (var counts = 0; counts < limits; counts++) {
      output += '<tr class="post_data">';
      output += '</tr>';
    }
    $('#load_data_filter').html(output);
  }

  function filter_data(limits, starts, CheckedRep, ClickedStatus, ClickedType, ClickedCategory, ClickedSubCategory, ClickedSubCategory_Filter,
    ClickedSource, ClickedSubSource, ClickedSubSource_Filter) {
    $.ajax({
      url: "<?=base_url()?>missed_call_campaign/toDoAjax",
      method: "POST",
      data: {
        type: 'text',
        CheckedRep: CheckedRep,
        ClickedStatus: ClickedStatus,
        ClickedType: ClickedType,
        ClickedCategory: ClickedCategory,
        ClickedSource: ClickedSource,
        ClickedSubSource: ClickedSubSource,
        ClickedSubCategory: ClickedSubCategory,
        ClickedSubCategory_Filter: ClickedSubCategory_Filter,
        ClickedSubSource_Filter: ClickedSubSource_Filter,
        limits: limits,
        starts: starts
      },
      cache: false,
      success: function(response) {
        $(".spinner").hide();
        $("#load_data").hide();

        if (response == '') {
          $('#load_data_message').html('<p class="content-desc">No More Data Found123</p>');
          action = 'active';
        } else {
          $('#load_data_filter').append(response);
          $('#load_data_message').html("");
          action = 'inactive';
        }
      }
    });
  }
});

1 Ответ

0 голосов
/ 15 января 2020

Я предлагаю вам повторно инициализировать ленивую загрузку после успешного извлечения данных из серверной части.

...