jQuery フォーム プラグインにはシリアル化に対してどのような利点があるのでしょうか?
フォーム プラグインを選択した場合、新しい jQuery 1.5 機能を使用できますか?
また、フォーム プラグインには、複数のポスト バックを停止する機能はありますか? 私は通常、重複する ajax 投稿を停止するためにAjax マネージャープラグインを使用しますが、フォーム プラグインでは使用できないと思います。
ありがとう
jQuery フォーム プラグインにはシリアル化に対してどのような利点があるのでしょうか?
フォーム プラグインを選択した場合、新しい jQuery 1.5 機能を使用できますか?
また、フォーム プラグインには、複数のポスト バックを停止する機能はありますか? 私は通常、重複する ajax 投稿を停止するためにAjax マネージャープラグインを使用しますが、フォーム プラグインでは使用できないと思います。
ありがとう
フォームプラグインを覗いてみました。正直なところ、jqueryの使用経験が少しあれば、プラグインを使用する理由はありません。単純なjqueryを簡単に使用するだけでは達成できないことは何もありません。ajaxを使用して完全なフォームデータを送信する必要がある場合は、serializeを使用します。
基本的なajax呼び出しに必要なのはこれだけですが、これを簡単にするためにフォームプラグインで何ができるでしょうか。
$.ajax({
type: 'POST',
url: post/to/this/url,
data: $("#myForm").serializeArray(),
success: function() {
// Woopie success!
window.location.href = successurl;
},
error: function(jqXHR, textStatus, errorThrown){
// do something with errors
}
});
jQuery Form Plugin は、フォームでの ajax の使用を簡素化します。フォーム属性を使用して、フォームを送信する方法と場所を決定します。フォームの method 属性は、使用するリクエスト タイプをプラグインに伝えます。フォームの action 属性は、フォームを送信する場所を示します。
次のようなフォームの例を考えてみます。
<form id="myform" action="submit.php" method="post">
<!--inputs and submit button go here-->
</form>
本質的に、それはあなたが書くことを可能にします:
$('#myform').ajaxForm();
それ以外の
$.post("submit.php", $("#myform").serialize());
jquery Form プラグインを使用すると、コードから Ajax 経由で送信することもできます。
$('#myform').ajaxSubmit();
とにかく、jQuery Forms Plugin はフォームをシリアル化します。サーバーに送信する前にシリアル化する必要があります。jQuery Form Plugin は、舞台裏でフォームをシリアライズするだけです。上記の例では、サーバーからの応答は処理されません。
以下のコードを使用すると、class 属性に「result」が含まれる要素に応答を追加できます。
$('#myform').ajaxForm({ target : ".result"});
target オプションには、jQuery でサポートされている任意のセレクターを使用できます。
遅延メソッドを使用できるかどうかはわかりません。互換性は 1.3.2+ 用であり、ネイティブの ajax メソッドはプラグインにラップされているため、私はそれを疑っています。Deferred オブジェクトがプラグイン内部から返されないようにします。
jQuery フォームには、使用できる beforeSubmit オプションがあります。したがって、上記のコードに追加すると、次のようになります。
$('#myform').ajaxForm({ target: ".result", beforeSubmit: function(arr, $form, options) {
// arr: The array of form data
// The array of form data takes the following form:
// [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ]
//some code to check if we already submitted the form
// return false to cancel submit
}
});
ただし、ユーザーがフォームを送信した後にページを終了した場合は、これを行うことはお勧めしません。クライアント側のコードが不必要に複雑になるだけです。ユーザーがフォームの送信後にページで他のことを行う場合は問題ありません。jQuery Forms プラグインには、サーバーが 200 "OK" 応答を返した場合に呼び出される関数コールバックを受け取る成功オプションがあります。プラグインの詳細については、プラグインhttp://jquery.malsup.com/form/の作成者の Web サイトをチェックすることもできます。
Ajax を使用してファイルをアップロードする場合、このプラグインは必須です。serializeArrayのドキュメントを見ると、次のことが明確に述べられています。
ファイル選択要素からのデータはシリアル化されません
このプラグインは、ファイルのアップロードを問題なく処理します。
タスクがフォームのシリアル化と送信のように単純な場合は、特別にフォーム プラグインは必要ありません。プラグインには、決して使用しない、または必要としない機能の割り当てを含めることができます。さらに、jQuery の知識が限られている場合、またはプラグインの作成方法にあまり精通していない場合、必要な方法でカスタマイズするのは簡単なことではありません。私は、タスクが複雑すぎて作成できないプラグインを選びます。その場合、プラグインが既にある場合、車輪を再発明する必要はありません。例として、HSB コントロールを備えたカラー ピッカーがあります。色がどのように機能するかがわからない場合は、調査を行って独自のカラー ピッカーを作成する時間と労力が無駄になります。
フォームをシリアル化して送信するための基本的なアプローチとして、次の 2 行を使用できます。
var data = $(form).serialize();
$.post('post.php', '&'+data);
$.post() の詳細については、http: //api.jquery.com/jQuery.post/#example-3 を参照してください。
フォームで複雑なことを行う必要があり、それらの機能がプラグインで既に利用可能であると感じた場合は、それを試して、どのように機能するかを確認しても問題ありません。
フォーム プラグインは、$.ajax が提供するのと同じオプション機能を使用して、1 回の呼び出しで ajax 経由でフォームを送信できるという点で便利です。インターフェイスをハイジャックしてその動作を強化するのに最適な方法です。何も変更する必要なく、faux-ajax (iframe) 経由でファイルのアップロードをスムーズに処理することもできます。
私の知る限り、フォーム プラグイン自体は、複数の送信を回避するために何もしません。私は非常に大規模なプロジェクトでさまざまなことにプラグインを使用していますが、通常、フォームが送信中かどうかを追跡し、送信中の場合は再度送信する機能を入力しないように、いくつかの追加コードを介して自分で処理します。