Почему Ajax-ответ в Wordpress не работает?

Question

У меня странная (для меня) проблема с ajax в Wordpress. Я не получаю правильный ответ от сервера. Я прочитал Wordpress Codex, чтобы узнать, что я делаю неправильно, но все равно не имею понятия.

Я не знаю, важно это или нет, но когда я попытался добавить тип в синтаксис ajax, я получил сообщение об ошибке.

class databaseClass
{
    function __construct()
    {

    if ( isset($_SERVER['HTTPS']) )  
       $protocol = 'https://';  
    else  
       $protocol = 'http://'; 

        wp_enqueue_script( 'ajaxScript', '/wp-content/themes/bulk/js/ajaxScript.js');
        wp_localize_script( 'ajaxScript', 'my_ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php', $protocol ), 
                 'nonce' => wp_create_nonce( '111')
            ) );
        add_action('wp_ajax_save_sort', 'ajaxFunctionInPHP');
        add_action( 'wp_ajax_nopriv_save_sort', 'ajaxFunctionInPHP');  
    }

    function ajaxFunctionInPHP(){
        /*check_admin_referrer();
        $response['custom'] = "ssss";
        $response = json_encode($response);
        wp_send_json($response) ;*/

        ob_clean();
        $response['custom'] = "TEST";

        echo $response;
        die();  
    }
}

class ajaxClass extends databaseClass
{
    function __construct()
    {
        parent::__construct();
    }





    public function ajaxPage()
    {
        echo '<form name="ajaxTest" type="POST">
             <input id="ajaxButton" type="button" value="KLIK"/>
             </form>
        ';
    }

}

jQuery( document ).ready( function () {
 jQuery('#ajaxButton').click(function() {
        var dataFromFunction="";
        jQuery.ajax({
            url: my_ajax_object.ajaxurl,
            type: 'POST',

            data: {
                action: 'save_sort',
                order: dataFromFunction
            },
            success: function (response){
                console.log("success message");
                console.log(response.custom)
            },
            error:  function (response){
                console.log("error message");
            }
        });
    });
} );

success message
ajaxScript.js?ver=5.0.4:15 undefined

Answer 1

Ваш код кажется правильным, но я делюсь своим личным подходом к этому в надежде, что это может быть полезно.Внесите изменения в JS, как упомянуто ниже:

jQuery( document ).ready( function ($) {
    $('#ajaxButton').click(function() {
       var dataFromFunction="Test Data";
       $.ajax({
           url: my_ajax_object.ajaxurl,
           type: 'POST',
           data: {
               action: 'save_sort',
               order: dataFromFunction
           },
       }).done( function (response){
           console.log("success message");
           console.log(response.custom)
       }).fail(function (response){
           console.log("error message");
       }).always(function(){
           console.log('Ajax Completed');
       });
    });
});

Также для локализации вашего скрипта хорошо определить параметр схемы в функции admin_url, но это не обязательно, поэтому 'ajax_url' => admin_url( 'admin-ajax.php') должно быть просто отлично.

Вы, кажется, создали nonce, но не использовали его, и хорошей практикой будет использование функции create nonce в разделе формы, а не в локализации.

У меня есть предложение для вашего ajaxФункция ответа, но это всего лишь совет.Измените свою функцию так, чтобы она возвращалась следующим образом:

function ajaxFunctionInPHP(){
    $response['dataFromFunction'] = sanitize_text_field($_POST['dataFromFunction']);
    wp_send_json( $response);
}

Удачи !!