Admin-Ajax Error

Question

I making homepage in the local host.

I need wp_query with Ajax.

but there's some error. I don't know why. Can you help me?

----> this is load_more_ajax.js

var page = 2;
var date_pass = "<?php echo($date_filter);?>";
var compare_pass = "<?php echo($compare);?>";
var ajaxurl = "<?php echo admin_url( 'admin-ajax.php' ); ?>";

jQuery(function($){

   $('body').on('click', '.loadmore', function(){

      var data = {
           'action': 'rnm_load_more_ajax',
           'page': page,
           'date_filter': date_pass,
           'compare': compare_pass,
           'security': '<?php echo wp_create_nonce("load_more_posts"); ?>'
       };

       $.post(ajaxurl, data, function(response){
           $('.race-posts').append(response);
           page++;
       });
   });
});

and, this is load_more_ajax.php

<?php
function load_posts_by_ajax_callback(){
   echo ("hello");    
}

this is add_action

add_action('wp_ajax_rnm_load_more_ajax', 'load_posts_by_ajax_callback');
add_action('wp_ajax_nopriv_rnm_load_more_ajax', 'load_posts_by_ajax_callback');

add_action('wp_enqueue_scripts', 'rnm_enqueue_fn');
function rnm_enqueue_fn(){

   wp_register_script('rnm_load_more', get_template_directory_uri() .'/js/load_more_ajax.js', array(), false, true);
   wp_enqueue_script('rnm_load_more');
}

This makes error like this.

I think there's some problem in the url of 'admin-ajax.php'

But I can't find any solution.

Answer 1

You need to pass the values to the localization script, "right" after this line:

wp_enqueue_script('rnm_load_more');

I'm going to pass the admin URL to your script by using wp_localize_script:

$localization = array(
    'ajax_url' => admin_url('admin-ajax.php'),
);
wp_localize_script( 'rnm_load_more', 'jjang', $localization );

Now, you can use the ajax_url in your script:

var ajaxurl = rnm_load_more.ajax_url;

You can send the rest of the data by using this method.

Answer 2

You can't use PHP code in a .js file, unless you change your config. Even if you did, you'd also have to load WP to get those URLs. What is happening right now is that you have the PHP code, and not its result, in the JS.

You'll probably want to use wp_localize_script to set data from WP that you can then access in a static JavaScript file.