Disable already selected option in the same dropdowns

[Alexray]

Hi there,

In case if you have 2 dropdowns where all of the options or some of them are equal and you don't want the same option to be choosen in both dropdowns, that JavaScript may help you:

<script>
document.addEventListener('DataPageReady', function (event) {
const dropdown1 = document.querySelector("#InsertRecordDropDown1");
const dropdown2 = document.querySelector("#InsertRecordDropDown2");

dropdown2.onchange = function () {
  let options1 = dropdown1.options;
  for (let a1 = 0; a1 < options1.length; a1++) {
    if (options1[a1].value == dropdown2.selectedOptions[0].value) {
      options1[a1].disabled = true;
    }
  }
};
dropdown1.onchange = function () {
  let options2 = dropdown2.options;
  for (let a2 = 0; a2 < options2.length; a2++) {
    if (options2[a2].value == dropdown1.selectedOptions[0].value) {
      options2[a2].disabled = true;
    }
  }
};
 
});
</script>

Make sure that you changed IDs of your dropdowns in constantas.

Hope someone find it useful=)