To fully reset Choices.js when reopening a Bootstrap modal, you should destroy and reinitialize the Choices instance each time the modal is shown. This ensures no cached state or UI artifacts persist:
javascript
$('#customTourModal').on('show.bs.modal', function () {
const selectors = [
'select[name="GSMCountryCode"]',
'select[name="NumberOfAdult"]',
'select[name="HowDidYouFindUsID"]'
];
selectors.forEach(sel => {
const el = this.querySelector(sel);
if (el) {
if (el._choicesInstance) {
el._choicesInstance.destroy();
}
el._choicesInstance = new Choices(el, {
placeholder: true,
removeItemButton: true,
shouldSort: false
});
}
});
});
This approach ensures the Choices.js UI is reset cleanly every time the modal is reopened.