javascript - बटन क्लिक पर व्यवस्थित रूप से सबमिट करने के लिए Angular2 से बचें




forms submit (6)

ठीक है तो शायद यह अस्पष्ट है। यह फॉर्म प्राप्त करें:

<form (ngSubmit)="submit()" #crisisForm="ngForm">
   <input type="text" name="name" [(ngModel)]="crisis.name">
   <button type="submit">Submit</button>
   <button type="button" (click)="preview()">Preview</button>
   <button type="reset" (click)="reset()">Reset</button>
</form>

सभी बटन submit() फ़ंक्शन को क्यों ट्रिगर करते हैं? और इससे कैसे बचें?


Answers

मेरे पास एक ही समस्या है। मेरे आस-पास के काम को प्रतिस्थापित करने वाला button था और एंकर तत्व को बटन शैली लागू करें:

<form (ngSubmit)="submit()" #crisisForm="ngForm">
   <input type="text" name="name" [(ngModel)]="crisis.name">
   <button type="submit">Submit</button>
   <a class="btn" (click)="preview()">Preview</a>
   <a class="btn" (click)="reset()">Reset</a>
</form>

आपको अपने app.module.ts में '@ कोणीय / रूपों' से फॉर्म मॉड्यूल आयात करना होगा

import { FormsModule } from '@angular/forms';
 @NgModule({
  imports: [
    FormsModule
 ],
 })

मैंने पाया कि 2.0 रिलीज (ngSubmit) के साथ विधि के लिए एक null घटना मूल्य गुजर रहा है, इसलिए आपको हमें (submit) करना चाहिए

<form (submit)="submit($event)" #crisisForm="ngForm">

आपकी .ts फ़ाइल

submit($event){
   /* form code */
   $event.preventDefault();
}

यह प्लंकर अन्यथा सुझाता है, हर बटन इरादे के रूप में काम करता प्रतीत होता है।

हालांकि, फ़ॉर्म के डिफ़ॉल्ट व्यवहार को रोकने के लिए आप यह कर सकते हैं,

टीएस:

submit(e){
 e.preventDefault();
}

टेम्पलेट:

<form (submit)="submit($event)" #crisisForm="ngForm">

उस बटन में टाइप प्रकार = "बटन" सेट करें जिसे आप सबमिट निष्पादित नहीं करना चाहते हैं।


हालांकि, मुझे पूरा यकीन है कि जब तक फॉर्म में केवल एक फ़ील्ड होता है और एक सबमिट बटन होता है, तब तक एंटर मारना फॉर्म जमा करना चाहिए, भले ही पृष्ठ पर कोई अन्य फॉर्म हो।

फिर आप जेएस के साथ सबमिट करने के फॉर्म को कैप्चर कर सकते हैं और जो भी सत्यापन या कॉलबैक चाहते हैं उसे करें।





javascript forms angular submit