web-dev-qa-db-ja.com

フォーム送信後のリダイレクトを防止

PHPで電子メールを送信するHTMLフォームがあり、送信すると、PHPページにリダイレクトされます。このリダイレクトが発生するのを防ぐ方法はありますか？jQueryでアニメーションを作成しました。私はリダイレクトの代わりに発生したいことを私は偽を返すしようとしました;しかし、それは動作しません。私の機能は次のとおりです。

$(function() {
    $('.submit').click(function() {
        $('#registerform').submit();
        return false;
    }); 
});

フォームの開始タグは次のとおりです。

<form id="registerform" action="submit.php" method="post">

そして、送信ボタン：

<input type="submit" value="SUBMIT" class="submit" />
jqueryhtmlformsredirect
22
Robert Pessagno

Ajaxで投稿する必要があります。これにより、ページの変更が停止されますが、情報は引き続き取得されます。

$(function() {
    $('form').submit(function() {
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: { username: $(this).name.value, 
                    password: $(this).password.value }
        });
        return false;
    }); 
})

JQueryのドキュメントを投稿する を参照してください

36
Bruce Armstrong

Falseを返す代わりに、event.preventDefault（）を試すことができます。このような：

$(function() {
$('#registerform').submit(function(event) {
    event.preventDefault();
    $(this).submit();
    }); 
});
12
bozdoz

Ajaxを使用する

jQuery Ajax requestメソッドを使用すると、電子メールデータをスクリプト（submit.php）に投稿できます。 successコールバックオプションを使用して、スクリプトの実行後に要素をアニメーション化します。

note-ajax応答オブジェクトを利用して、スクリプトが正常に実行されたことを確認することをお勧めします。

$(function() {
    $('.submit').click(function() {
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: 'password=p4ssw0rt',
            error: function()
            {
               alert("Request Failed");
            },
            success: function(response)
            {  
               //EXECUTE ANIMATION HERE
            } // this was missing
        });
        return false;
    }); 
})
5
Derek Adair
$('#registerform').submit(function(e) {
   e.preventDefault();
   $.ajax({
        type: 'POST',
        url: 'submit.php',
        data: $(this).serialize(),
        beforeSend: //do something
        complete: //do something
        success: //do something for example if the request response is success play your animation...
   });

})
5
Matricore

フォーム内の情報をPHPページで処理する場合は、そのPHPページを呼び出します。リダイレクトを回避するには、または、このプロセスで更新する場合は、AJAXを介してフォーム情報を送信しますおそらくjQueryダイアログを使用して、結果またはカスタムアニメーションを表示します。

5
mwotton

可能と思われるjavascriptを実行できる場合は、新しいiframeを作成し、代わりにそのiframeに投稿します。できるよ <form target="iframe-id" ...>そのようにすれば、すべてのリダイレクトはiframe内で発生し、引き続きページを制御できます。

もう1つの解決策は、ajaxを介して投稿することです。ただし、ページでエラーチェックなどを行う必要がある場合は、少し注意が必要です。

以下に例を示します。

$("<iframe id='test' />").appendTo(document.body);
$("form").attr("target", "test");
4
Amir Raminfar

ここで何を達成しようとしているのかを正確に知ることは難しいですが、javascriptでこの問題を解決するために時間を費やす場合は、AJAXリクエストが最善の策です。ただし、 d PHPでこれを完全に実行したい場合は、スクリプトの最後にこれを配置し、設定する必要があります。

if(isset($_SERVER['HTTP_REFERER'])){
    header("Location: " . $_SERVER['HTTP_REFERER']);    
} else {
    echo "An Error";
}

これにより、ページは2回変更されますが、ユーザーはリクエストを開始したページで終了します。これはこれを行う正しい方法にさえ近いものではなく、AJAXリクエストを使用することを強くお勧めしますが、これで仕事は完了します。

4
Steven Zurek

以下のように使用できます

e.preventDefault()

このメソッドが呼び出されると、イベントのデフォルトアクションはトリガーされません。

また、これを読むことを提案する場合：.prop（）vs .attr（）

私はそれがあなたを助けることを願っています、

コード例：

$('a').click(function(event){
    event.preventDefault();
    //do what you want
  }
1
gargAman

簡単な答えは、AJAX request。を介して外部スクリプトへの呼び出しを打ち切ることです。その後、応答を好きなように処理します。

1
Parris Varney

Submit（）呼び出し内に戻り値を配置する必要があります。

  $('.submit').click(function() {
     $('#registerform').submit(function () {
     sendContactForm();
     return false;
    });
    //Here you can do anything after submit
}
1
Juan

ブルース・アームストロングが 彼の答え で提案したように。ただし、FormDataを使用します。

$(function() {
    $('form').submit(function() {
        var formData = new FormData($(this)[0]);
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: formData,
            processData: false,
            contentType: false,
        });
        return false;
    }); 
})
1
flix

HTTPの設計は、データでPOSTを作成するとページが返されることを意味します。元のデザイナーは、おそらくそれをPOSTの「結果」ページにすることを意図していました。

PHP application to POST=同じページに戻るため、POSTリクエストを処理できないため、ただし、元のGETに基づいて、POSTからの新しい情報を使用して更新ページを生成できますが、サーバーコードがまったく異なる出力を提供するのを妨げるものは何もありません。または、POSTまったく別のページに。

出力が必要ない場合、AJAX=離陸前に見た1つのメソッドは、サーバーがHTTP応答コード（と思う）250を返すことでした。これは "コンテンツがありません。これにより、ブラウザはデータを無視します。

もちろん、3番目の方法は、代わりに送信されたデータでAJAXを呼び出すことです。

1
staticsan

おそらく、あなたはあなたのページにAjaxリクエストをしなければならないでしょう。そして、return false思っていることとは違うことをしている。

0
Lachezar