क्या ऐसा फ़ॉर्म सबमिट करना संभव है जिसमें सबमिट बटन नहीं है (एंटर दबाकर) उदाहरण:
<form [ngFormModel]="xxx" (ngSubmit)="xxxx()">
<input [(ngModel)]="lxxR" ngControl="xxxxx"/>
</form
जवाबों:
हो सकता है कि आप इनपुट फ़ील्ड में जोड़ते हैं keypress
या keydown
फ़ंक्शन को उस फ़ंक्शन को असाइन करते हैं जो दर्ज करने पर सबमिट होता है
आपका टेम्प्लेट इस तरह दिखेगा
<form (keydown)="keyDownFunction($event)">
<input type="text" />
</form
और आप अपनी कक्षा के अंदर कार्य करते हैं, ऐसा लगेगा
keyDownFunction(event) {
if (event.keyCode === 13) {
alert('you just pressed the enter key');
// rest of your code
}
}
आप भी जोड़ सकते हैं (keyup.enter)="xxxx()"
संपादित करें:
<form (submit)="submit()" >
<input />
<button type="submit" style="display:none">hidden submit</button>
</form>
इस पद्धति का उपयोग करने के लिए, आपके पास सबमिट बटन होना चाहिए, भले ही वह प्रदर्शित न हो " टूलकिट के उत्तर के लिए धन्यवाद "
पुराना उत्तर:
हां, जैसा आपने लिखा है, इसके (submit)
बजाय घटना का नाम इसके अलावा है (ngSubmit)
:
<form [ngFormModel]="xxx" (submit)="xxxx()">
<input [(ngModel)]="lxxR" ngControl="xxxxx"/>
</form>
मैं पसंद करता हूं (keydown.enter)="mySubmit()"
क्योंकि यदि कर्सर कहीं था, <textarea>
लेकिन उसके अंत में नहीं तो एक लाइन ब्रेक नहीं जोड़ा जाएगा।
यह तरीका बहुत सरल है ...
<form [formGroup]="form" (keyup.enter)="yourMethod(form.value)">
</form>
लैगिंग से बचने के लिए हमेशा कीपैड.इंटर के बजाय कीडाउन का उपयोग करें।
<textarea [(ngModel)]="textValue" (keydown.enter)="sendMessage();false" ></textarea>
और Components.ts के अंदर कार्य करते हैं
textValue : string = '';
sendMessage() {
console.log(this.textValue);
this.textValue = '';
}
इसे अपने इनपुट टैग के अंदर जोड़ें
<input type="text" (keyup.enter)="yourMethod()" />
बस जोड़ दो (keyup.enter)="yourFunction()"
उम्मीद है कि यह किसी की मदद कर सकता है: किसी कारण से मैं समय की कमी के कारण ट्रैक नहीं कर सका, अगर आपके पास एक फॉर्म है:
<form (ngSubmit)="doSubmit($event)">
<button (click)="clearForm()">Clear</button>
<button type="submit">Submit</button>
</form>
जब आप Enter
बटन दबाते हैं, तो clearForm
फ़ंक्शन को कॉल किया जाता है, भले ही अपेक्षित व्यवहार doSubmit
फ़ंक्शन को कॉल करने के लिए था । Clear
बटन को <a>
टैग में बदलने से मेरे लिए समस्या हल हो गई। मैं अभी भी जानना चाहूंगा कि यह अपेक्षित है या नहीं। मुझे भ्रमित करने लगता है
यदि आप दोनों सरल को शामिल करना चाहते हैं जो मैंने यहां देखा था, तो आप इसे अपने बटन को फॉर्म के अंदर शामिल करके कर सकते हैं।
एक संदेश भेजने वाले फ़ंक्शन के साथ उदाहरण:
<form>
<mat-form-field> <!-- In my case I'm using material design -->
<input matInput #message maxlength="256" placeholder="Message">
</mat-form-field>
<button (click)="addMessage(message.value)">Send message
</button>
</form>
आप बटन पर क्लिक करने या एंटर की दबाने का विकल्प चुन सकते हैं।
यदि आप दोनों को शामिल करना चाहते हैं - प्रवेश पर स्वीकार करें और क्लिक पर स्वीकार करें तो करें -
<div class="form-group">
<input class="form-control" type="text"
name="search" placeholder="Enter Search Text"
[(ngModel)]="filterdata"
(keyup.enter)="searchByText(filterdata)">
<button type="submit"
(click)="searchByText(filterdata)" >
</div>