Перенаправление после отправки формы с помощью ajax в WordPress

#php #ajax #wordpress

#php #ajax #wordpress

Вопрос:

У меня есть форма, которая использует Ajax для отправки на WordPress. Форма работает нормально, информация из нее поступает в базу данных и сохраняется правильно.

Проблема в том, что я не могу перенаправить ее на другую страницу. Форма действительно проста

 <form method="post" id="main">
                <?php wp_nonce_field( 'my_nonce' ); ?>

     <div class="columns is-multiline">
         <div class="column is-4">
             <input type="text" name="firstname" />
         </div>
         <div class="column is-4">
             <input type="text" name="middlename" />
         </div>
         <div class="column is-4">
             <input type="text" name="lastname" />
         </div>
     </div>
     <div id="success_message"></div>
         <div class="columns">        
             <div class="column is-3">
                 <input type="submit" name="submit-button" id="submit-button" value="Submit" />
             </div>
         </div>
     </div>
</form>
  

Тогда у меня есть это в functions.php

 add_action('wp_enqueue_scripts', 'my_ajax_scripts'); 
function my_ajax_scripts(){
    wp_localize_script( 'myscript', 'myajax', array( 'ajaxurl' =>   admin_url( '/admin-ajax.php' ) ) );
}

add_action('wp_enqueue_scripts', 'ajax_scripts'); 
function ajax_scripts(){
    wp_enqueue_script( 'form', get_template_directory_uri().'/assets/js/form.js', array('jquery'), '1.0', true );

}

function form(){

        global $wpdb;

        if (!check_ajax_referer( 'my_nonce' )){
            wp_die();
        }

        $table = UPC_jobs;

        $formdata = $_POST['formdata'];

        parse_str($formdata, $formdata_array);

        $data = array(
            'firstname' => $_POST['firstname'],
            'middlename' => $_POST['middlename'],
            'lastname' => $_POST['lastname'],
        );

        $format = array(
            '%s', '%s', '%s',' %s'
        );        
        $success=$wpdb->insert( $table, $data, $format );
        if($success) {
            wp_redirect( '/my-target' );
            wp_die();
        }
}
  

И если нужна часть js

 $('#main').submit(function(e) {
    e.preventDefault();

    var form = $(this);
    var formdata = (window.FormData) ? new FormData(form[0]) : null;
    var data = (formdata !== null) ? formdata : form.serialize();

    formdata.append("action", "form");

    $.ajax({
        type: 'POST',
        url: myajax.ajaxurl,
        contentType: false,
        processData: false,
        dataType: 'JSON',
        status: 200,
        data: formdata,
        success: function( data ){     
            window.location.replace("https://example"); // this doesn't work as well 
        },          
    });         
});
  

Когда я нажимаю Submit , ничего не происходит, абсолютно ничего. Вся информация хранится в базе данных, как и должно быть, но страница ничего не реагирует / не показывает.

Также рабочим решением было бы просто показать сообщение о том, что форма успешно отправлена (не оповещение)

Комментарии:

1. Вы не можете выполнить HTTP-перенаправление в ответ на запрос AJAX и ожидать, что это окажет какое-либо влияние на интерфейс. Итак, если вы не хотите, чтобы ответ на запрос AJAX на самом деле был тем, что /my-target вернул бы запрос, wp_redirect( '/my-target' ); в этом мало смысла. (И в зависимости от того, каким на самом деле является этот ответ, он также может не попасть в обработчик успеха.)

2. какая-либо ошибка на консоли?

3. Нет, ничего. Там все понятно и прекрасно.

4. удалите эту строку и проверьте dataType: 'JSON',

Ответ №1:

Вы пробовали вместо успешного обратного вызова использовать always? В вашем случае вы можете попробовать это

 $.ajax({
        type: 'POST',
        url: myajax.ajaxurl,
        contentType: false,
        processData: false,
        dataType: 'JSON',
        status: 200,
        data: formdata            
    }).always(function() {     
       window.location.replace("https://example"); // this doesn't work as well 
    });         
  

Комментарии:

1. Интересно. Я не знал об .always . Есть ли способ перенести сообщение с перенаправлением, которое я также могу показать в <div id="success_message"></div>

2. @Jordan конечно, вы можете всегда выполнять обратный вызов любого кода

3. Вы можете добавить это в always callback $('#success_message').show(); // show msg setTimeout(function(){ // and redirect in 2 seconds window.location.replace("https://example"); }, 2000); Работает ли это для вас?

4. Кроме того, с always это означает, что оно будет отображаться всегда, даже когда форма завершилась ошибкой, верно?