I have a code. THe input and output works as expected. Only from UI side though, the toggle button is not working properly. i.e. the initial state is on and then I change it to off but while submitting, the toggle button is turned on again by itself. But the values are displayed as selected i.e. Y in case of true and N in case of false. Only the button gets switched on and I need to prevent it.
When I again load the page, it shows the selected value. Problem arises only after I save with 'N' value and then submit it.
Here is the code:
html
// toggle button
<div class="col-md-4">
<div class="form-group radioWrap mt-3">
<label>Is Entity Active?*</label>
<div class="col-md-4">
<label class="custom-toggle" >
<input type="checkbox" name="isActive [(ngModel)]="submitData.basicDetails.isActive"
(ngModelChange)="updateBooleanValue($event)">
<span class="custom-toggle-slider rounded-circle"></span>
</label>
</div>
</div>
</div>
// submit and save btn
<button id="submitform" class="btn-sq btn btn-sm btn-secondary pull-right ml-2 mr-0"
(click)="submitForm('submit')" [disabled]="!basicForm?.valid || submitDisable()" placement="top"
tooltip="Submit Entity" container="body">
<i class="lni-thumbs-up iconsize2"></i>
</button>
<button id="saveform" class="btn-sq btn btn-sm btn-secondary pull-right ml-2 mr-0"
(click)="submitForm('save')" [disabled]="!basicForm?.valid || submitDisable()" placement="top" tooltip="Save Entity"
container="body">
<i class="lni-save iconsize2"></i>
</button>
ts
submitForm(action) {
// on save/submit click change URL.
const myURLMaster = action === 'save' ? '/entitysave' : '/entitysubmit';
// check for issuer selection
if (this.yieldValid()) {
// check for yield curve type uniqueness
if (this.confirmYieldCurve()) {
const obj = {
conservativeRating: null,
conservativeRatingId: null,
rated: 'N',
ratingDetails: []
};
const input = {
basicDetails: this.submitData.basicDetails,
entityRating: obj,
otherDetails: null,
contactDetails: null
};
if (this.submitData.basicDetails.isActive === false || this.submitData.basicDetails.isActive === 'N') {
this.submitData.basicDetails.isActive = 'N';
} else if (this.submitData.basicDetails.isActive === true || this.submitData.basicDetails.isActive === 'Y') {
this.submitData.basicDetails.isActive = 'Y';
}
console.log(this.renderData);
console.log(input);
// on save/submit click change URL.
const diffJson = this.diffPatcher.diff(this.submitData.basicDetails, this.renderData);
console.log(diffJson);
this.DataService.getPortfolioData(myURLMaster, input).subscribe(
data => {
if (data.validationStatus === 'ERROR') {
const errorMsgs: any = data.errorMsgs;
this.DataService.errorSwal(errorMsgs[0].errorMsg);
} else if (data.validationStatus === 'SUCCESS') {
this.DataService.successTimerSwal(data.data);
setTimeout(() => {
if (action === 'submit' || action === 'save') {
this.router.navigate(['/entityCMaster']);
}
}, 2000);
}
},
errorCode => {
if (errorCode.status === 400) {
this.DataService.errorSwal(JSON.stringify(errorCode));
setTimeout(() => {
this.blockUI.stop();
}, 500);
// alert(JSON.stringify(errorCode));
}
}
);
}
}
}
where this.submitData.basicDetails.isActive is value to be sent
Aucun commentaire:
Enregistrer un commentaire