ajax request in wordpress

Question

i create ajax request in functions.php

function my_enqueue() {
    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/script.js', array('jquery') );
    wp_localize_script( 'ajax-script', 'cc_ajax_object', 
        array( 'ajax_url' => admin_url( 'ajaxrequest.php' ) ) );
}

add_action( 'wp_enqueue_scripts', 'my_enqueue' );

add_action( 'wp_footer', 'add_js_to_wp_footer' );
function add_js_to_wp_footer()
{ 
   ?>
   <script type="text/javascript">
   jQuery('.all-categories').click(function($){
     jQuery.ajax({
       type : "post",
       dataType : "json",
       url : cc_ajax_object.ajax_url,
       data: {
        'action': 'get_products',        
      },
      success:function(data) {
        // This outputs the result of the ajax request
        console.log(data);
      },
      error: function(errorThrown){
         console.log(errorThrown);
      }
   });
  });
  </script>

and in ajaxrequest.php

<?php 
 /* ajaxrequest page */
 function get_products()
 {
    echo "test";
 }

no errors in network but data = null in console

whats is the mistake ????

Answer 1

You can take reference from below code. Remove your ajaxrequest.php file, no need of that file because i have added ajaxrequest.php file's code in active theme's functions.php file.

I have changed ajax url and add js script code in script.js file. I have tested and it is working for me. let me know if this works for you.

functions.php

function my_enqueue() {
    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/script.js', array('jquery') );
    wp_localize_script( 'ajax-script', 'cc_ajax_object', 
        array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}

add_action( 'wp_enqueue_scripts', 'my_enqueue' );


add_action('wp_ajax_get_products', 'get_products' ); // executed when logged in
add_action('wp_ajax_nopriv_get_products', 'get_products' ); // executed when logged out
function get_products()
{
  echo "test";
  wp_die();
}

script.js

jQuery(document).ready(function($) {
   jQuery('.all-categories').click(function($){
     jQuery.ajax({
       type : "post",
       dataType : "json",
       url : cc_ajax_object.ajax_url,
       data: {
        'action': 'get_products',        
      },
      success:function(data) {
        // This outputs the result of the ajax request
        console.log(data);
      },
      error: function(errorThrown){
         console.log(errorThrown);
      }
   });
  });
});

Answer 2

Forget about the separate ajaxrequest.php file. Your error is in the wp_localize_script, you need to point to the admin-ajax.php file when you localize the script:

function my_enqueue() {
    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/script.js', array('jquery') );
    wp_localize_script( 'ajax-script', 'cc_ajax_object', 
        array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}

add_action( 'wp_enqueue_scripts', 'my_enqueue' );

Another thing is about the function that will manage the response, instead of requiring it in your theme function.php file, put the code directly in the theme function file.