Angular.js: ngSubmitは、type = "button"のない任意のボタンでフォーム送信を起動します

作成日 2014年01月28日 · 13コメント · ソース: angular/angular.js

Angularがフォームを2回送信するという問題が発生しました。

        <div class="text-center">
          <input type="submit" class="btn btn-primary" value="Create" />
          <button class="btn btn-primary" ng-click="close()">Close</button>
        </div>

ここの両方のボタンはフォームを送信し、二重送信になります。この問題は、type = "button"以外のボタンでフォームを角度で送信することに関係していることを理解しています。その属性を閉じるボタンに追加すると修正されます。これが意図されているかどうかはわかりませんが、私がそれを理解するまでそれは私を困惑させたので、それに注意を向けることを決定しました。

forms low inconvenient

ソース

parliament718

👍21

最も参考になるコメント

私はこれで何時間も無駄にしました...

ng-submitは、type = "submit"が明示的に設定されているボタンに対してのみ起動する必要があります。

soichih 2014年07月31日

👍81 👎6 ❤5

全てのコメント13件

puttint type = "button"で送信を防ぐことができるとは言及されていませんが、これはドキュメントで説明されていると思います。

フォームに1つ以上の入力フィールドと1つ以上のボタンまたはinput [type = submit]がある場合、入力フィールドのいずれかでEnterキーを押すと、最初のボタンのクリックハンドラー、または入力type = submitとsubmitハンドラーがトリガーされます。同封のフォーム（ngSubmit）

Narretz 2014年01月28日

👍43 ❤8 🎉4 👀1

私はこれで何時間も無駄にしました...

ng-submitは、type = "submit"が明示的に設定されているボタンに対してのみ起動する必要があります。

soichih 2014年07月31日

👍81 👎6 ❤5

それは.... htmlがどのように機能するかではありませんか？

caitp 2014年07月31日

👍12

ああ、これはHTMLフォームがデフォルトで任意のボタンを送信ボタンとして処理する方法です..Angularとは何の関係もありません（Angularはフォーム送信イベントを使用してng-submitを起動しています-これは理にかなっています）。では、なぜtype = "submit"が存在しなければならないのだろうか？

とにかく..送信ボタンでない限り、すべてのボタンにtype = "button"を追加します。

soichih 2014年07月31日

👍23 😄3

@ soichih-はい、その通りです。 ngSubmitは送信イベントに反応しているだけであり、ブラウザーはそれをトリガーする責任があります。

これが発生する可能性のあるシナリオは実際にはいくつかあります。

ハンドラーの二重実行を防ぐには、ngSubmitまたはngClickディレクティブのいずれか1つのみを使用してください。これは、HTML仕様に次のフォーム送信ルールがあるためです。
フォームに入力フィールドが1つしかない場合、このフィールドにEnterキーを押すと、フォーム送信（ngSubmit）がトリガーされます。
フォームに2つ以上の入力フィールドがあり、ボタンまたはinput [type = submit]がない場合、Enterキーを押しても送信はトリガーされません
フォームに1つ以上の入力フィールドと1つ以上のボタンまたはinput [type = submit]がある場合、入力フィールドのいずれかでEnterキーを押すと、最初のボタンのクリックハンドラー、または入力type = submitとsubmitハンドラーがトリガーされます。同封のフォーム（ngSubmit）

ここに文書化されています： https ：
ngSubmitドキュメントで複製するか、より明示的に参照する必要があります。