web-dev-qa-db-ja.com

Ajaxリクエストが成功したページのリダイレクト

クライアント側の検証にAjaxを使用するフォームがあります。フォームの最後は次のとおりです。

$.ajax({
        url: 'mail3.php',
        type: 'POST',
        data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

        success: function(result) {
            //console.log(result);
            $('#results,#errors').remove();
            $('#contactWrapper').append('<p id="results">' + result + '</p>');
            $('#loading').fadeOut(500, function() {
                $(this).remove();

            });

        }
    });

編集：これはエラーを処理する私のmail3.phpファイルです：

$errors=null; 

if ( ($name == "Name") ) {
    $errors = $nameError; // no name entered
}
if ( ($email == "E-mail address") ) {
    $errors .= $emailError; // no email address entered
}
if ( !(preg_match($match,$email)) ) {
    $errors .= $invalidEmailError; // checks validity of email
}
if ( $spam != "10" ) {
    $errors .= $spamError; // spam error
}

if ( !($errors) ) {
    mail ($to, $subject, $message, $headers);
    //header ("Location: thankyou.html");
    echo "Your message was successfully sent!";
    //instead of echoing this message, I want a page redirect to thankyou.html

} else {
    echo "<p id='errors'>";
    echo $errors;
    echo "</p>";
}

Ajaxリクエストが成功し、エラーが存在しない場合、Thank Youページにユーザーをリダイレクトできるかどうか疑問に思いました。これは可能ですか？

ありがとう！アミット

javascriptjqueryajaxredirect
40
Amit

承知しました。次のような成功関数の最後に何かを置くだけです。

if(result === "no_errors") location.href = "http://www.example.com/ThankYou.html"

サーバーが応答を返す場所no_errorsエラーが存在しない場合。

36
Adam

エラーチェックを行い、すべてが成功したらwindow.locationユーザーを別のページにリダイレクトします。

$.ajax({
    url: 'mail3.php',
    type: 'POST',
    data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

    success: function(result) {
        //console.log(result);
        $('#results,#errors').remove();
        $('#contactWrapper').append('<p id="results">' + result + '</p>');
        $('#loading').fadeOut(500, function() {
            $(this).remove();

        });

        if ( /*no errors*/ ) {
            window.location='thank-you.html'
        }

    }
});
15
tj111

次のようにsuccessハンドラーでリダイレクトできます。

window.location.href = "thankyou.php";

または、結果を表示しているので、数秒待ちます。たとえば、これは2秒待ちます。

setTimeout(function() {
  window.location.href = "thankyou.php";
}, 2000);
11
Nick Craver
$.ajax({
        url: 'mail3.php',
        type: 'POST',
        data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

        success: function(result) {

            //console.log(result);
            $('#results,#errors').remove();
            $('#contactWrapper').append('<p id="results">' + result + '</p>');
            $('#loading').fadeOut(500, function() {
                $(this).remove();

            });

            if(result === "no_errors") location.href = "http://www.example.com/ThankYou.html"

        }
    });
2
morels

Mail3.phpファイルで、try {} catch {}でエラーをトラップする必要があります

try {
    /*code here for email*/
} catch (Exception $e) {
    header('HTTP/1.1 500 Internal Server Error');
}

その後、success呼び出しでエラーが発生することはないので、エラーを心配する必要はありません。

使用できます：window.location.href = "thankyou.php";ニックが述べたようなあなたの成功関数内。

2
Jeremy Boyd

別のオプションは次のとおりです。

window.location.replace("your_url")
0
Aram Mutlu

正確な状況を別のスレッドに投稿しました。再投稿。

すみません、これは上記の質問に対する答えではありません。

しかし、興味深いトピックをもたらします--- AJAXを使用する場合、およびAJAXを使用しない場合。この場合、AJAXを使用しないことをお勧めします。

ログインとパスワードの簡単な例を見てみましょう。ログインまたはパスワードが一致しない場合は、AJAXを使用して「ログインが正しくありません」という簡単なメッセージを報告してください。ただし、ログインおよびパスワードがIS正しい、なぜユーザーページにリダイレクトするためにAJAX関数をコールバックしなければならないのですか？

こんな場合、これは単純なForm SUBMITを使用するだけでいいと思います。ログインに失敗した場合、Relogin.php？error = InvalidLogin ...のようなURLでGETメッセージを使用してLogin.phpと同じように見えるRelogin.phpにリダイレクトします。

ちょうど私の2セント。 :)

0
Nitin Hurkadli

私はあなたがそれをすることができると思う：

window.location = "your_url";
0
MilkyWayJoe

これを2つの方法で攻撃できると思います。

1）window.location = 'http://www.yourdomain.comを成功関数に挿入します。

2）さらにajax呼び出しを使用して、これをページの要素に挿入します。詳細については、jQueryのドキュメントで http://api.jquery.com/jQuery.get/ を参照してください。

0
simnom