ajax get data from custom table WordPress

I am trying to learn how to get the content from a custom database table via wordpress ajax but don’t know how to do this.

file name: process-order.php

   add_action( 'wp_ajax_get_drawing_size', 'get_drawing_size' );
   add_action( 'wp_ajax_nopriv_get_drawing_size', 'get_drawing_size' );
   function get_drawing_size() {

    global $wpdb;
    $drawing_id = $_POST['drawing_id'];
    $relation_result = $wpdb->get_results( "SELECT size.* FROM 
   `www_order_pro_relation` as relation RIGHT JOIN `www_order_pro_size` as 
    size on size.`id`=relation.`size_id` WHERE relation.`drawing_id` = 
 $drawing_id ");
    wp_send_json_success( array(
            'count' => $relation_result
        ));
     //$data = array( 'returnValue' => $relation_result);
    // echo "<pre>";
    // print_r($relation_result);
    // echo "</pre>";
            die();
            // return true;
// die("I am calling");
}

AJAX Code file -> size.php

<a href="#" onclick="call_ajax()">Click me</a>
<script type="text/javascript">
  function call_ajax(){
        jQuery.ajax({
        url : order_process_ajax_object.ajax_url,
        data : {action: "get_drawing_size","drawing_id":"drawing_id"},
        method: 'POST',
        success: function( data ) 
         {
          
        }
    }); 
}

I want the result here

<div class="row">
                    <div class="size-header">
                        <h3> Size </h3>
                    </div>
                         
                                <div class="col-md-2 size">
                                    
                                            <p> <?php //echo $print->title; ?></p>
                                            <h4> <?php //echo $curency ?> <?php //echo $print->price; ?> </h4>
                                            <div id="responsecontainer" align="center">
                                                **HERE**
                                            </div>
                                        
                                </div>

                    
                </div>

Anyone Plz help me

Answer

You have to bind callback function with the hooks used for ajax call.

Instead of this code

function order_process_ajax() {

   add_action( 'wp_ajax_get_drawing_size', 'get_drawing_size' );
   add_action( 'wp_ajax_nopriv_get_drawing_size', 'get_drawing_size' );
   function get_drawing_size() {

    global $wpdb;
    $drawing_id = $_POST['drawing_id'];
    $relation_result = $wpdb->get_results( "SELECT size.* FROM 
   `www_order_pro_relation` as relation RIGHT JOIN `www_order_pro_size` as 
    size on size.`id`=relation.`size_id` WHERE relation.`drawing_id` = 
 $drawing_id ");
    wp_send_json_success( array(
            'count' => $relation_result
        ));
     //$data = array( 'returnValue' => $relation_result);
    // echo "<pre>";
    // print_r($relation_result);
    // echo "</pre>";
            die();
            // return true;
// die("I am calling");
}

Replace this code and put in functions.php file of your active theme

add_action( 'wp_ajax_get_drawing_size', 'get_drawing_size' );
add_action( 'wp_ajax_nopriv_get_drawing_size', 'get_drawing_size' );
function get_drawing_size() {
    global $wpdb;
    $drawing_id = $_POST['drawing_id'];
    $relation_result = $wpdb->get_results( "SELECT size.* FROM 
   `www_order_pro_relation` as relation RIGHT JOIN `www_order_pro_size` as 
    size on size.`id`=relation.`size_id` WHERE relation.`drawing_id` = 
 $drawing_id ");
    wp_send_json_success( array(
            'count' => $relation_result
        ));
     //$data = array( 'returnValue' => $relation_result);
    // echo "<pre>";
    // print_r($relation_result);
    // echo "</pre>";
            die();
            // return true;
// die("I am calling");
}

Flow will be like this: When you click button, ajax call will trigger with action: "get_drawing_size","drawing_id":"drawing_id" data. Here action is important.

WordPress will check for the hook associated with the action name. In your case, it will check for the hook wp_ajax_get_drawing_size for logged in user and wp_ajax_nopriv_get_drawing_size for not logged in user.

Above hooks are not mentioned in your code. So please add those hook and link the callback function. I have attached the code above.