achi9141
achi9141

Reputation: 3

Reset a form group on button click in Angular 6(Responsive form)?

I am trying to clear the form values after a button click. The following shows the HTML and Angular Component. On the same button click I want the values to reset or refresh. Thanks.

 onAddClientNeeds() {
        
        this.listOfNeedsAssessment.push(this.needsAssessment.value);
        this.isNeedsAssessmentAdded = true;
    }
<div [formGroup]="needsAssessment" class="main-container">
    <div class="header-section">
    <div class="flex-container">
        
            <div class="edit-section">
                <p class="edit-title">Mental Health</p>
                <div class="edit-body">
                    <select class="form-control" (change)="onchange($event)" (blur)="onchange($event)" id="mental_health">
                        <option selected value="0">Select Option</option>
                        <option *ngFor="let mentalHealth of mentalHealthList" value={{mentalHealth.Id}}>{{mentalHealth.Item}}</option>
                    </select>
                </div>
            </div>
            <div class="edit-section">
                <p class="edit-title">Persistant Pain</p>
                <div class="edit-body">
                    <select class="form-control" (change)="onchange($event)" (blur)="onchange($event)" id="persistant_pain">
                        <option selected value="0">Select Option</option>
                        <option *ngFor="let persistantPain of persistantPainList" value={{persistantPain.Id}}>{{persistantPain.Item}}</option>
                    </select>
                </div>
            </div>
            
        <div class="button-select">
            <button type="button" class="create-button" (click)="onAddClientNeeds()">Add Needs Assessment Outcomes</button>
        </div>
    </div>
</div>

Upvotes: 0

Views: 2546

Answers (2)

Atiqur Rehman
Atiqur Rehman

Reputation: 1

onAddClientNeeds(){ this.needAssessment.reset();}

Upvotes: 0

T. Shashwat
T. Shashwat

Reputation: 1165

Just call the function reset()

onAddClientNeeds() {
  if (this.needsAssessment.valid) {
    this.needsAssessment.reset();     
  }
}

Upvotes: 1

Related Questions