Angular.js: يؤدي ngSubmit إلى إرسال النموذج على أي زر بدون كتابة = "button"
لقد واجهت مشكلة حيث كان Angular يرسل استماري مرتين.
<div class="text-center">
<input type="submit" class="btn btn-primary" value="Create" />
<button class="btn btn-primary" ng-click="close()">Close</button>
</div>
يقوم كلا الزرين هنا بإرسال النموذج مما يؤدي إلى إرسال مزدوج. أدرك أن المشكلة تتعلق بإرسال النموذج على أي زر ليس من النوع = "button". تؤدي إضافة هذه السمة إلى زر الإغلاق إلى إصلاحها. لا أعرف ما إذا كان هذا مقصودًا ولكنه حيرني حتى اكتشفت ذلك ، لذا قررت لفت الانتباه إليه.
parliament718
ال 13 كومينتر
أعتقد أن هذا موضح في المستندات ، على الرغم من عدم ذكر أنه يمكنك منع الإرسال عن طريق puttint type = "button":
إذا كان النموذج يحتوي على واحد أو أكثر من حقول الإدخال وزر واحد أو أكثر أو إدخال [نوع = إرسال] ، فإن الضغط على إدخال في أي من حقول الإدخال سيؤدي إلى تشغيل معالج النقر على الزر الأول أو نوع الإدخال
Narretz
في ٢٨ يناير ٢٠١٤
لقد ضيعت ساعات في هذا ...
يجب تشغيل ng-submit فقط للأزرار التي تم ضبط type = "submit" عليها بشكل صريح.
soichih
في ٣١ يوليو ٢٠١٤
هذا .... ليس كيف يعمل أتش تي أم أل؟
caitp
في ٣١ يوليو ٢٠١٤
حسنًا ، هذه هي الطريقة التي يتعامل بها نموذج HTML مع أي زر كزر إرسال افتراضيًا .. لا علاقة له بـ Angular (ويستخدم Angular نموذج إرسال الحدث لإطلاق ng-submit - وهو أمر منطقي). أتساءل لماذا يجب أن يكون type = "submit" موجودًا إذن؟
على أي حال .. سأتأكد من إضافة type = "button" على جميع الأزرار ما لم يكن زر إرسال.
soichih
في ٣١ يوليو ٢٠١٤
soichih - نعم ، أنت على حق. يتفاعل ngSubmit فقط مع حدث الإرسال ويكون المتصفح مسؤولاً عن تشغيل ذلك.
يوجد في الواقع عدد من السيناريوهات عندما يحدث ذلك.
لمنع التنفيذ المزدوج للمعالج ، استخدم توجيه واحد فقط من توجيهات ngSubmit أو ngClick. هذا بسبب قواعد إرسال النموذج التالية في مواصفات HTML:
- إذا كان النموذج يحتوي على حقل إدخال واحد فقط ، فإن الضغط على Enter في هذا الحقل يؤدي إلى إرسال النموذج (ngSubmit)
- إذا كان النموذج يحتوي على أكثر من 2 من حقول الإدخال ولا توجد أزرار أو إدخال [type = submit] فإن الضغط على Enter لا يؤدي إلى إرسال الإرسال
- إذا كان النموذج يحتوي على واحد أو أكثر من حقول الإدخال وزر واحد أو أكثر أو إدخال [نوع = إرسال] ، فإن الضغط على إدخال في أي من حقول الإدخال سيؤدي إلى تشغيل معالج النقر على الزر الأول أو نوع الإدخال
تم توثيقه هنا: https://docs.angularjs.org/api/ng/directive/form
يجب علينا إما تكرارها أو الإشارة إليها بشكل أكثر صراحة في مستندات ngSubmit.
petebacondarwin
في ٣١ يوليو ٢٠١٤
petebacondarwin تريد وضع تصحيح سريع لذلك؟
caitp
في ٣١ يوليو ٢٠١٤
أوه ، استمر ثم :-)
petebacondarwin
في ٣١ يوليو ٢٠١٤
شكرا جزيلا لتوضيح هذا لك! ربما لم أكن قد فهمت هذا من خلال هذا المنشور! هتافات! - ستيف
svanetten1976
في ٢٠ يناير ٢٠١٥
لمعلوماتك ، يحدث هذا أيضًا في Ionic3 .... تؤدي إضافة type = "button" إلى الزر الثاني أيضًا إلى إصلاح المشكلة
rodneyjoyce
في ٢٦ أبريل ٢٠١٧
شكرا soichih
arabindawhiz
في ٣٠ أغسطس ٢٠١٧
يجب أن تكون حذرًا لأنه إذا كان لديك أكثر من زر واحد حتى إذا كنت قد حددت أن أحدها يتم إرساله ، فسيتم إرساله في أي منها لا يحتوي على النوع = "button".
fabidefabula
في ١٣ فبراير ٢٠١٨
ماذا لو لم تكن إضافة type="button" حلاً لأن مكونات الأزرار المخصصة مستخدمة في النموذج؟
moniuch
في ١٥ مارس ٢٠١٨
moniuch ، كما هو موضح في المستندات ، يتم ذلك بواسطة المتصفح وليس AngularJS. إنه سلوك HTML قياسي.
gkalpak
في ١٥ مارس ٢٠١٨
القضايا ذات الصلة
jetta20162
·
3تعليقات
jpsimons
·
3تعليقات
piu
·
3تعليقات
gkalpak
·
3تعليقات
ashclarke
·
3تعليقات
التعليق الأكثر فائدة
لقد ضيعت ساعات في هذا ...
يجب تشغيل ng-submit فقط للأزرار التي تم ضبط type = "submit" عليها بشكل صريح.