web-dev-qa-db-ja.com

this.form.submit（）;に優れたjQueryソリューションがありますか？

現在の要素が含まれるフォームの送信イベントをトリガーしたい。

_this.form.submit();
_

メソッドがすべてのブラウザーで機能することを100％確信しているわけではないので、おそらくjQueryを使用して、より良いソリューションがあるかどうか疑問に思っています。

編集：

私が抱えている状況は次のとおりです。

_<form method="get">
    <p><label>Field Label
        <select onchange="this.form.submit();">
            <option value="blah">Blah</option>
            ....
        </select></label>
    </p>
</form>
_

_<select>_の変更時にフォームを送信できるようにします。

私が探しているのは、フォーム上のIDまたは名前を知らなくても、フォーム内のフィールドで機能するソリューションです。 $('form:first')および$('form')は、フォームがページの3番目になる可能性があるため機能しません。また、私はすでにサイトでjQueryを使用しているため、jQueryを少し使用することは大したことではありません。

それでは、jQueryにinput/select/textareaがあるフォームを取得させる方法はありますか？

javascriptjqueryformssubmit
43
Darryl Hein

あなたが探しているのは次のようなものだと思います：

$(field).closest("form").submit();

たとえば、onchangeイベントを処理するには、次のようにします。

$(select your fields here).change(function() {
    $(this).closest("form").submit();
});

何らかの理由でjQuery 1.3以降を使用していない場合は、parentsの代わりにclosestを呼び出すことができます。

106
Matthew Crumley
this.form.submit();

これはおそらくあなたの最善策です。特にプロジェクトでjQueryをまだ使用していない場合は、この目的のためだけにjQuery（または他のJSライブラリ）を追加する必要はありません。

25
Beau Simensen

常に JQuery-ize your.submitを実行できますが、同じことを呼び出すだけでもかまいません。

$("form").submit(); // probably able to affect multiple forms (good or bad)

// or you can address it by ID
$("#yourFormId").submit();

attach 関数を送信イベントに追加することもできますが、それは別の概念です。

3
patridge

JQueryを使用する最良のソリューションは

$(this.form).submit()

このステートメントjqueryプラグイン（たとえば jquery form plugin ）を使用すると正常に動作し、jquery DOMの走査オーバーヘッドが最小限に抑えられます。

3
Mikus

Matthew's answerと同様に、次のことができることがわかりました。

$(this).closest('form').submit();

間違った例：親機能を使用する際の問題は、フィールドが動作するためにフォーム内にすぐに存在する必要があることです（tds、ラベルなどの中ではありません）。

私は修正しました：parents（s）でも動作します。それを指摘してくれたThxs Paolo。

3
Darryl Hein

「現在の要素」が何を意味するのかを説明していないという点で、あなたの質問はやや混乱しています。

すべての種類の入力要素と「submit」タイプのボタンがあるページに複数のフォームがある場合、そのフィールドのいずれかを入力して「enter」を押すと、そのフォームの送信がトリガーされます。 Javascriptは必要ありません。

ただし、フォームに複数の「送信」ボタンがあり、他の入力がない場合（たとえば、表の「行の編集」および/または「行の削除」ボタン）、投稿した行がそれを行う方法になる可能性があります。

別の方法（Javascriptは不要）は、すべてのボタン（「送信」タイプ）に異なる値を与えることです。このような：

<form action="...">
    <input type="hidden" name="rowId" value="...">
    <button type="submit" name="myaction" value="edit">Edit</button>
    <button type="submit" name="myaction" value="delete">Delete</button>
</form>

ボタンをクリックすると、ボタンを含むフォームのみが送信され、ヒットしたボタンの値のみが（他の入力値と一緒に）送信されます。

次に、サーバー上で変数「myaction」の値を読み取り、何をするかを決定します。

1
Marko Dumic

JQueryで呼び出すことができます

$("form:first").trigger("submit")

それがはるかに良いかどうかわからない。 form.submit（）;かなり普遍的です。

0
Brig Lamoreaux
<form method="get">
   <p><label>Field Label
      <select onchange="this.form.submit();">
         <option value="blah">Blah</option>
            ....
     </select>
     </label>
   </p>
    **<!-- <input name="submit" type="submit" /> // name="submit_new_name" -->**
  </form>

<!-- 

   this.form.submit == this.form.elements['submit'];

-->
0
Zhaipeng