Skip to main content
1 of 4
Ferhat
  • 115
  • 7

Woocommerce with Lazy Load php and ajax

I want the photos to load as I scroll down with the window scroll, but I get an error in the ajax request, I wonder what is the error that I can't see?

The error I get is below

POST http://localhost/test/wp-admin/admin-ajax.php 400 (Bad Request)

Following my code : jQuery

jQuery(document).ready(function () {
  let limit = 4;
  let start = 0;
  let action = 'inactive';

  function load_country_data(limit, start) {
    jQuery.ajax({
      url: "http://localhost/test/wp-admin/admin-ajax.php",
      method: "POST",
      data: {limit: limit, start: start},
      cache: false,
      action: 'test',
      success: function (data) {
      jQuery('#load_data').append(data);
      if (data === '') {
      $('#load_data_message').html("<button type='button'> No Data Found </button>");
         action = 'active';
       } else {
      $('#load_data_message').html("<button type='button'> Please Wait... </button>")
         action = "inactive";

         }
       }
     });
  }

  if (action === 'inactive') {
  action = 'active';
  load_country_data(limit, start);
 }
 jQuery(window).scroll(function () {
  if (jQuery(window).scrollTop() + jQuery(window).height() > jQuery('#load_data').height() && 
   action == 'inactive') {
   action = 'active';
   start = start + limit;
   setTimeout(function () {
   load_country_data(limit, start);
     }, 1000);
    }
  });
});

functions.php

add_action('wp_ajax_test', 'test');
add_action('wp_ajax_nopriv_test', 'test');

function test(){
    global $wpdb;
    if(isset($_POST["limit"], $_POST["start"])){
        $d = $_POST['start']. ",".$_POST['limit'];
        $list = $wpdb->get_results("Select * From {$wpdb->prefix}load_more ORDER  BY id ASC LIMIT ".$d);
        foreach ($list as $val2) {
            echo '
        <h3>'.$val2->header.'</h3>    
        ';
    }
  }
}

Thank you in advance for your help

Ferhat
  • 115
  • 7