So I am facing this problem here,in short it goes like I have two templates which are conditionally displayed on click of Next and Previous
so it is essentially lightning combo-box component with three values which forms the first screen. Now on clicking the Next button opens up a template which shows certain questions based on the selected option from the previous template lightning combo-box options. example if the option is selected as "30 day Template" in the first modal box in the second template it will show as shown in the screenshot here,subsequent changes will appear for other options.Please not the Previous button also in this modal box where in clicking it will take us back to the previous page and we can toggle between the two.
Now the problem which is occurring is Whenever I am trying to select any other value from the lightning combo-box after the first time selection the second template is populating not only populating the equivalent mapped questions for the one selected in the drop-down,but also the ones which were previously selected.It is appending all the fields mapped for the selected drop-down list which are currently selected as well as previously selected. For example: if in the first modal box I had selected "30 day Template" which is mapped to lets say to 3 fields namely A,B and C which is displayed in the second modal box once I have click on the Next button.Now I decide to go back clicking previous and select a different option lets say 10 day template which is mapped to lets say 4 fields D,F,G and H and click on the next button,in the second modal box now it is displaying the fields mapped for the previously selected option i,e. A,B,C as well as the one currently selected D,F,G and H.
handleChange(event) {
let mySet = new Set();
console.log('in here in selection');
const selectedTemplateNameDummy = event.detail.value;
console.log('selectedOptiondsds=' +selectedTemplateNameDummy);
getTemplateLineItems({
selectedTemplateName : selectedTemplateNameDummy
})
.then(result => {
console.log('entered then');
let data = JSON.parse(JSON.stringify(result));
console.log('letdata'+data);
console.log('letdataStringify'+JSON.stringify(result));
for(var key in data){
this.mapData.push({value:data[key], key:key});
console.log('value is'+data[key]);
console.log('key is'+key);
}
})
.catch(error => {
this.error = error;
});
}
The next and Previous functions are only for the toggling of the templates Please help in this regard and it is urgent.Do let me know if any question comes up.