現在のページをリフレッシュ/リダイレクトせずにフォームを送信する（Python（Django）+ jQuery + Ajax）

Question

jQuery AjaxでPythonを使用して現在のページをリフレッシュせずにフォームを送信する方法はありますか？ Facebookのコメントの仕組みと同様の最終結果が欲しい。

私は現在、Ajaxを実行するためにjQueryフォームを使用しています。 jQueryのフォーム、私が送信されたフォームにリフレッシュアドレスバーにURLを使用して送信した後

1. ：しかし、それは私がするので欲しいユーザ体験を与えるものではありません。

2. ページを更新しました。私はそれが特に好きではない、私は最大ページにスクロールしたページの下部にあったと言うことをしましょう。フォームを送信すると、ページがリフレッシュされ、フォーカスがページの上部にリダイレクトされました。

私が欲しいものを明確にしたいと思っています。私はFacebookのコメントシステムのようなものが必要です。誰かがコメントした後、そのコメントはページを一切リフレッシュせずに提出されました。

EDIT

のjQueryコード：

$('#review_submit').submit(function() { 
     var options = {};   
     $(this).ajaxSubmit(options); 
     return false; 
}); 



    $('[name=submit_review_btn]').click(function(){      
     $('#review_submit').submit(); 
    }); 

ので、提出を処理するためのPythonのコードは、サーバー側のコードからページをリダイレクトする必要があるので、このURLにページをリダイレクトします、 'main_URL.com'

を示すjQueryのコードと、結果は次のとおり

1. URLはアドレスバーに表示されます：main_URL.com/ form_action_url < ---これはフォームを送信するように設定したフォームアクションです。

2. サーバー側で設定したページにリダイレクトされたページ。

私はこのAjaxエクスペリエンスと混同しています。

Answer 1

jqueryのフォームを使用する代わりに、jqueryのajaxPostを使用してこれを処理できます。これにより、フォームを.serialize()（パラメータを取得する）にし、JS関数に戻って「フォームが送信された」後に必要な処理を実行できるようになります。ポストは、AJAX呼び出しを通じて起こるようにこのページを更新しませんjQuery.post()

jsFiddle

をチェックしてください。それは、ポストが通過した後に関数を実行することを可能にし、あなたが望むw/eを行います（もしポストがデータを返すなら、ここで利用可能です...これが成功した後に別のGETまたはPOSTをしたいなら、ここで行うことができます...など）

Answer 2

JavaScriptコードを投稿した方が簡単に答えることができます。

送信ボタンでフォームを送信していますか？もしそうなら、jQuery Formはすべてを処理し、ページを更新しません。

あなたはJavaScriptでフォームを送信している場合は、あなたのコードは、jQueryのフォームの例のようになります。

// attach handler to form's submit event 
$('#myFormId').submit(function() { 
    // submit the form 
    $(this).ajaxSubmit(); 
    // return false to prevent normal browser submit and page navigation 
    return false; 
}); 

return false;はここに非常に重要です。それ以外の場合、ユーザーはリダイレクトされます。

動作するようにあなたのシステムの場合、あなたはそれが2フェーズを実行する必要があります。

1. コメント
2. コメントの残りの部分にコメントを追加する（またはサーバから新しいコメントを取得してから追加提出）

現在の設定はどのようになっていますか？

Answer 3

私はこの技術をあらゆる場所で使用する非常に動的なサイトを持っています。 Dojoを使用しますが、原則は同じです。上記のポスターのように、あなたのフォームはonsubmit = "return false;属性として（または送信するフォームオブジェクト内で）ページがリロードされないようにします。

サーバー側では、リダイレクトは使用しませんが、JSON（またはXMLなど）で応答し、応答ハンドラ（jQuery、Dojoなど）に次に何をするかを指示します。

ほとんどの時間を、プロセスは次のとおりです。

1. ポストの値を返す
2. は、サーバー上で作業を行うxhrPOSTコール
3. 戻るJSON/XML /テキスト
4. ハンドルを持つフォームjavascriptで何をするかを決定してください

具体的な例は次のとおりです。

（閉じ

javascriptのXHRコールバックハンドラは、次に何をすべきかを決定する{：：「バイタルを受けた。」成功}または{「無効な番号」エラー}

1. ユーザーは
2. Serverが検証され、リターンが患者のバイタルを提出しますダイアログには、）新しいエントリのためのフォームを更新または不足している分野への注意を喚起する

編集：いくつかのPythonのWebフレームワークに リンク：基本的なチュートリアル0にlink

リンクnはlink

もう一つのノート（jQueryを使って）ジャンゴにJSONを返す：あなたはJSONを使用している場合は、XはXMLの略として、それは、もはやAJAX 技術的にではありません。