How to disable the value of Combobox in javascript ?

@rajanv-sfnA6E • Oct 27, 2024

Oct 27, 2024

1.6K

Hi I need some help. I have three comboboxes :

Each combobox have following values to select :

Combobox 1:
English
French
Spanish
Italian

Combobox 2:
English
French
Spanish
Italian

Combobox 3:
English
French
Spanish
Italian

When the values are selected in Combobox 1 let's say English, then this value is to be disabled in Combobox 2 & 3 both. I want to do this in javascript. can any body help.

Thanks in advance

Like 0 Replies 5

Replies

Welcome, guest

Join CrazyEngineers to reply, ask questions, and participate in conversations.

CrazyEngineers powered by Jatra Community Platform

simplycoder

@simplycoder-NsBEdD • Sep 22, 2014

Show us what have you tired.
Also please clarify if you want it to disable the value or remove it from combo box.
0
Prasad Ajinkya

@prasad-aSUfhP • Sep 24, 2014

Prepopulate the language strings in an array
On change of the first dropdown/selelct, empty the 2nd and 3rd dropdown and populate them with all strings except the one in the 1st.
0

RajanV

@rajanv-sfnA6E • Sep 24, 2014

Sorry for the late reply. I tried this code. Could any one help me out of this now. Because i not getting how would i get into this ...

<html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 
  <script type="text/javascript">
 
  function selectedLanguage(lang,comboxbox_id){
 
  console.log(comboxbox_id);
 
  var langSelected = lang.options[lang.selectedIndex].value;
  console.log(langSelected);
 
  if(comboxbox_id === 'language1'){
 
  if(langSelected === 1){
  //do nothing
  document.getElementById('language2').style.disabled = true;
 
  }else if(langSelected === 2){
 
  }
 
  }else if(comboxbox_id === 'language2'){
  if(langSelected === 1){
  //do nothing 
 
  }else if(langSelected === 2){
 
  }
  } 
  }
 
  </script>
 
  </head>
  <body>
 
  <select name="language1" id="language1" onchange="selectedLanguage(this,this.id)">
 
  <option value="1">Disabled</option>
  <option value="2">English US</option>
  <option value="3">Greek</option>
  <option value="4">Swedish</option>
 
  </select>
 
 
  <select name="language2" id="language2" onchange="selectedLanguage(this,this.id)">
 
  <option value="1">Disabled</option>
  <option value="2">English US</option>
  <option value="3">Greek</option>
  <option value="4">Swedish</option>
 
  </select>
 
  </body>
</html>

Manashree Thokal

@manashree-7mZH3V • Sep 26, 2014

Did you check if there are any js errors on the browser?

Debug using F12 button on browser.
0
Anoop Kumar

@anoop-kumar-GDGRCn • Sep 26, 2014

Try this.. #-Link-Snipped-#
I got little time and did this. but it's not full.
You can disable the drop down after selecting it and if user want to select again. add a reset button to reset all the drop-down. I think it should be fine after that.

0