Wordpress: execute do_shortcode () inside ajax function

Question

I am implementing a wordpress frontend PHP page that contains a list of hyperlinks in the body and wpdatatable in the footer.

I want to reload the data table every time the user selects a link, and this needs to be done via ajax without reloading the entire page.

What I have done so far:
I defined my action in \ wp-content \ themes \ Avada \ functions.php as follows:

function tenders_shortcode() {
    echo do_shortcode("[wpdatatable id=49 var1=".$_POST['id']." var2=".$GLOBALS['cgv']['archive']."]");
}

add_action('wp_ajax_tenders_shortcode', 'tenders_shortcode'); // add action for logged users
add_action( 'wp_ajax_nopriv_tenders_shortcode', 'tenders_shortcode' ); // add action for unlogged users

And inside my homepage, I made an ajax call like this:

function toggleTable(ministryId) {


    $.post( '<?php echo admin_url('admin-ajax.php'); ?>', {    
      action: "tenders_shortcode",
      id: ministryId
    }, function(datatable) {
      alert("success");
      jQuery("#tendersResult").html(datatable)
    });

}

where "tendersResult" is the div that should contain the data.

The problem is that the html of the returned data table contains css link tags and always displays "0".

The following shows how it is displayed in the browser, see text 0:

And this is how it appears in the inspector:

, , , . !

: , wp_die(), Fencer04, , do_shortcode() " css , datatable " display: none"

Answer 1

:

function tenders_shortcode() {
    echo do_shortcode("[wpdatatable id=49 var1=".$_POST['id']." var2=".$GLOBALS['cgv']['archive']."]");
    wp_die(); //Added
}

add_action('wp_ajax_tenders_shortcode', 'tenders_shortcode'); // add action for logged users
add_action( 'wp_ajax_nopriv_tenders_shortcode', 'tenders_shortcode' ); // add action for unlogged users

wp_die() , .