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