Перенаправить другую страницу после успешной отправки формы - PullRequest
0 голосов
/ 12 сентября 2018

Мне нужно перенаправить другую страницу после успешной отправки формы.Я новичок в JavaScript.Мне нужно знать, как поступить правильно.Перенаправить на другую страницу после успешной отправки формы через AJAX.сначала этот код имеет форму отправки после перенаправления на другую страницу.

Я программирую с php / wordpress.

Мой код php:

<form id="alecaddd-testimonial-form" action="#" method="post" data-url="<?php echo admin_url('admin-ajax.php'); ?>">

  <div class="field-container">
    <input type="text" class="field-input" placeholder="Adult" id="name" name="name" required>
    <small class="field-msg error" data-error="invalidName">Your Name is Required</small>
  </div>

  <div class="field-container">
    <input type="text" class="field-input" placeholder="infant" id="infant" name="infant" required>
    <small class="field-msg error" data-error="invalidName">Your Name is Required</small>
  </div>


  <div class="field-container">
    <input type="email" class="field-input" placeholder="Child" id="email" name="email" required>
    <small class="field-msg error" data-error="invalidEmail">The Email address is not valid</small>
  </div>

  <div class="field-container">
    <input type="date" class="field-input" placeholder="date" id="date" name="date" required>
    <small class="field-msg error" data-error="invalidEmail">The Email address is not valid</small>
  </div>



  <div class="field-container">
    <textarea name="message" id="message" class="field-input" placeholder="Your Message" required></textarea>
    <small class="field-msg error" data-error="invalidMessage">A Message is Required</small>
  </div>

  <div class="field-container">
    <div>
      <a href="order.php?id=102" class="btn btn-success">
            <button type="stubmit" class="btn btn-default btn-lg btn-sunset-form">BOOK NOW</button>
        </div>
        </a>
    <small class="field-msg js-form-submission">Submission in process, please wait&hellip;</small>
    <small class="field-msg success js-form-success">Message Successfully submitted, thank you!</small>
    <small class="field-msg error js-form-error">There was a problem with the Contact Form, please try again!</small>
  </div>

  <input type="hidden" name="action" value="submit_testimonial">
  <input type="hidden" name="nonce" value="<?php echo wp_create_nonce("testimonial-nonce") ?>">

</form>

Вот мой код: Javascript / jQuery

 ! function o(n, i, u) {
function c(r, e) {
    if (!i[r]) {
        if (!n[r]) {
            var t = "function" == typeof require && require;
            if (!e && t) return t(r, !0);
            if (l) return l(r, !0);
            var s = new Error("Cannot find module '" + r + "'");
            throw s.code = "MODULE_NOT_FOUND", s
        }
        var a = i[r] = {
            exports: {}
        };
        n[r][0].call(a.exports, function(e) {
            return c(n[r][1][e] || e)
        }, a, a.exports, o, n, i, u)
    }
    return i[r].exports
}
for (var l = "function" == typeof require && require, e = 0; e < u.length; e++) c(u[e]);
return c }({
1: [function(e, r, t) {
    "use strict";

    function o() {
        document.querySelectorAll(".field-msg").forEach(function(e) {
            return e.classList.remove("show")
        })
    }
    document.addEventListener("DOMContentLoaded", function(e) {
        var a = document.getElementById("alecaddd-testimonial-form");
        a.addEventListener("submit", function(e) {
            e.preventDefault(), o();
            var r = {
                name: a.querySelector('[name="name"]').value,
                email: a.querySelector('[name="email"]').value,
                message: a.querySelector('[name="message"]').value,
                nonce: a.querySelector('[name="nonce"]').value
            };
            if (r.name)


                if (/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(String(r.email).toLowerCase()))
                    if (r.message) {
                        var t = a.dataset.url,
                            s = new URLSearchParams(new FormData(a));
                        a.querySelector(".js-form-submission").classList.add("show"), fetch(t, {
                            method: "POST",
                            body: s
                        }).then(function(e) {
                            return e.json()
                        }).then(function(e) {
                            window.location.href = 'https://www.google.com';
                        }).catch(function(e) {
                            o(), a.querySelector(".js-form-error").classList.add("show")
                        }).then(function(e) {
                            o(), 0 !== e && "error" !== e.status ? (a.querySelector(".js-form-success").classList.add("show"), a.reset()) : a.querySelector(".js-form-error").classList.add("show")   
                        })

                    } else a.querySelector('[data-error="invalidMessage"]').classList.add("show");
            else a.querySelector('[data-error="invalidEmail"]').classList.add("show");
            else a.querySelector('[data-error="invalidName"]').classList.add("show")
        })
    })
}, {}] }, {}, [1]); //# sourceMappingURL=form.js.map

Любая помощь, как всегда, очень ценится.

Ответы [ 3 ]

0 голосов
/ 12 сентября 2018

Вы можете перенаправить страницу, используя следующие методы:

Используя метатег в голове:

<meta http-equiv="refresh" content="0;url=http://your-page-url.com" />

Обратите внимание, что content = "0; ... используется через сколько секунд вам нужно перенаправить страницу

Используя JavaScript:

window.location.href = "http://your-page-url.com";

Используя jQuery:

$(location).attr('href', 'http://yourPage.com/');
0 голосов
/ 12 сентября 2018

использование window.location.href

Например-

window.location.href = 'https://stackoverflow.com';
0 голосов
/ 12 сентября 2018

Заменить header("Location:http://www.google.com");

с:

window.location.href = 'https://www.google.com';

header() - это функция PHP, которая означает, что «прежде чем отправить ответ обратно клиенту (браузеру), добавьте заголовок Location:. Этот заголовок говорит Chrome перенаправить с помощью кода состояния 301 или 302. Очевидно, код PHP не будет работать в Javascript.

Учитывая, что в браузере происходит ТОЛЬКО JavaScript, нет заголовков, которые нужно устанавливать. Вы можете просто указать javascript для прямой навигации по текущему окну по указанному вами URL.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...