CODEWITHSUNDEEP
angular
Kumara
Kumara

Reputation: 528

Angular radio button reset not working properly

I am using below radio buttons for my form

<input type="radio" class="form-check-input" value="1" [checked]="true" name="keys" [(ngModel)]="lostkey.key">One
<input type="radio" name="keys" value="2" [(ngModel)]="lostkey.key" class="form-check-input">Both

I set 'One' radio button as a default checked using below code

ngOnInit() {
    this.lostkey.key = '1';
}

this is my reset button. This is working well. all forms reset. but problem is, default radio button also unchecked. therefor i re-assign it after form reset. but it did not work.

reset button (this is working correctly )

<button type="button" class="btn btn-action btn-flat float-right"
    (click)="resetForm(reportlostkeyform)">
    <i class="fas fa-redo"></i> <span> Reset</span>
</button>

this is reset function

resetForm(reportlostkeyform: NgForm) {
    reportlostkeyform.reset();
    this.lostkey.key = '1';
}

how i reassign this radio button value

Upvotes: 0

Views: 1696

Answers (2)

Chellappan வ
Chellappan வ

Reputation: 27303

You can resets the form control with an initial value like this

 resetForm(reportlostkeyform: NgForm) {
      reportlostkeyform.reset({keys:'1'});
 }

Upvotes: 1

ammadkh
ammadkh

Reputation: 597

try to reset value in setTimeout;

    resetForm(reportlostkeyform: NgForm) {
        reportlostkeyform.reset();
        setTimeout(() => {
        this.lostkey.key = '1';
       })    
    }

Upvotes: 1

Related Questions