Two textboxes were created, one for the title and another for the name.
Validations have been implemented to only submit information if both textboxes are filled.
The issue arises when attempting to clear the variable values after submission, triggering validation messages.
Is there a way to submit successfully and clear variable values without triggering the validator?
html
<div style="margin-top:16px;width:50%">
<dx-text-box placeholder="title..." [showClearButton]="true" [(ngModel)]="title">
<dx-validator>
<dxi-validation-rule type="required" message="Insert Title">
</dxi-validation-rule>
</dx-validator>
</dx-text-box>
</div>
<div style="margin-top:16px;width:50%">
<dx-text-box placeholder="name..." [showClearButton]="true" [(ngModel)]="name">
<dx-validator>
<dxi-validation-rule type="required" message="Insert Name">
</dxi-validation-rule>
</dx-validator>
</dx-text-box>
</div>
<dx-button text="Submit" [useSubmitBehavior]="true" (onClick)="Save()"></dx-button>
.ts
title: string;
name: string;
Save(){
if(this.title == "" || this.title == undefined || this.name == "" || this.name == undefined){
}
else{
alert("Sucess !!");
this.title = "";
this.name = "";
}
}
Problem
https://i.sstatic.net/cRXpb.png
After successful submission and clearing variable values, the validator is unexpectedly triggered, disrupting the expected initial state.