• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1592
  • Last Modified:

dynamic change in combo box

Hi,

      How is it possible to change one combo box based on a change in another. example. One combo box has list of months. the second reflects the holidays in that month. if february then the second combobox will reflect all holidays in that month.

BRgds,

kNish
0
eyeqube
Asked:
eyeqube
  • 2
  • 2
2 Solutions
 
mverschoofCommented:
I don't know where you get the holidays fromk, or if you just want to hard code them.

The easiest way is to use display. Try the following. I tested the page and it works.
<html>
<head>
<script type="text/javascript">
var shown = "none";
 
function showMonth(which)
{
  if(which != shown) {
    document.getElementById(which).style.display = "block";
    if(shown != "none") {
      document.getElementById(shown).style.display = "none";
    }
    else {
      // do nothing
    }
    shown = which;
  }
}
</script>
</head>
<body>
 
<select onchange="showMonth(this.value)">
  <option value="january">January</option>
  <option value="february">February</option>
</select>
 
<select id="january" style="display:none;">
  <option>option 1</option>
  <option>option 2</option>
</select>
 
<select id="february" style="display:none;">
  <option>option 3</option>
  <option>option 4</option>
</select>
 
</body>
</html>

Open in new window

0
 
FinecCommented:
In this way?
<select id="months" multiple="multiple" onchange="get_holidays(this)">
  <option value="1">January</option>
  <option value="2">February</option>
  <option value="3">March</option>
</select>
 
<select id="holidays" multiple="multiple" size="5">
</select>
 
<script type="text/javascript">
 
var holiday = new Array();
 
var january = new Array();
january[1] = "New Year";
january[4] = "4th of January";
//....
holiday[1] = january;
 
var february = new Array();
february[12] = "12th of February"
//...
holiday[2] = february;
 
var march = new Array();
march[28] = "28th of March"
//...
holiday[3] = march;
 
function get_holidays(select)
{
 
  var holidays = document.getElementById('holidays');
  holidays.options.length = 0;
  
  for(var i=0; i<select.options.length; i++)
  {
    if(select.options[i].selected)
    {
      for(var j=0; j<=31; j++)
      {
        var tempMonth = holiday[select.options[i].value];
        if(tempMonth[j])
        {
          var option = document.createElement('option');
          option.text = holiday[select.options[i].value][j];
          holidays.appendChild(option);
        }
      }
    }
  }
  
}
 
</script>

Open in new window

0
 
eyequbeAuthor Commented:
Hi,

           mverschoof: you have said it right. However, I consider that the data is coming from tables. how is it possible to get that table data to reflect in the combo box.


bRgds,

kNish
0
 
mverschoofCommented:
Can you be more specific? maybe give an example or something
0
 
eyequbeAuthor Commented:
Hi,

         Find attached with this mail an image. Specifically, when one combo box displays the sequence name, the second combo box should display its relevant shots based on the sequence id. This is a stored in a table.


BRgds,

kNish
sequence-shot-link.JPG
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now