0

This question already has an answer here:

I'm developing a custom plugin. The plugin provides a shortcode that outputs some HTML to the front-end, wherever it is called. For the sake of example, this HTML includes a form button and textfield. When the button is clicked on the front-end, I want to use jQuery to make an AJAX call to fetch some data and populate the textfield. The data is calculated and returned from one of my plugins functions.

What request URL should I use for my AJAX request? I could create an ajax-handler.php script, place this inside my plugin directory, require the plugin php class, and access its functionality that way, but I am unsure if this is the best practice...

Is there a more efficient / native WordPress way of handling plugin AJAX requests on the front end?

marked as duplicate by fuxia Dec 24 '18 at 0:32

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

2

Well, yes - there is a lot better way of doing this.

First of all, you should never do any direct requests to files inside wp-content directory. Securing and hardening WordPress properly is much harder, if some plugin does such requests.

And of course there is no need of doing them.

WP has built-in mechanism for AJAX requests. You can read full docs here: https://codex.wordpress.org/AJAX_in_Plugins

All your AJAX requests should be sent to wp-admin/admin-ajax.php. This way you can process them efficiently using these hooks:

  • wp_ajax_my_action
  • wp_ajax_nopriv_my_action

So somewhere in your plugin PHP file you do:

// Enqueue your JS file
function my_enqueue($hook) {    
    wp_enqueue_script( 'ajax-script', plugins_url( '/js/my-script.js', __FILE__ ), array('jquery') );

    // in JavaScript, object properties are accessed as ajax_object.ajax_url
    wp_localize_script( 'ajax-script', 'My_Ajax_bject',
        array( 'ajax_url' => admin_url( 'admin-ajax.php' )
    );
}
add_action( 'admin_enqueue_scripts', 'my_enqueue' );


// AJAX request handler
function my_action() {
    global $wpdb;  // you can use global WP variables and so on
    $whatever = intval( $_POST['whatever'] );
    $whatever += 10;
    echo $whatever;
    wp_die();
}
add_action( 'wp_ajax_my_action', 'my_action' );

And in your JS file:

jQuery(document).ready(function($) {
    var data = {
        'action': 'my_action',
        'whatever': 1
    };

    $.post(ajax_object.ajax_url, data, function(response) {
        alert('Got this from the server: ' + response);
    });
});
  • Does this apply to public requests on the front end ? It seems odd that these front-end requests would be sent to 'wp-admin/admin-ajax.php ? – Scratcha Dec 24 '18 at 1:39
  • @Scratcha yes, it applies to ALL Ajax requests. – Krzysiek Dróżdż Dec 24 '18 at 8:08

Not the answer you're looking for? Browse other questions tagged or ask your own question.