Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Shifting Select List Options

Status
Not open for further replies.

arpan

Programmer
Oct 16, 2002
336
IN
An HTML Form has 2 select lists along with a checkbox. Assume that the 1st select list shows 3 options - Jan, Feb & Mar. The 2nd select list shows the remaining 9 months. Now what I want is when the checkbox is checked (i.e. using the onClick() event), all the 9 options in the 2nd select list should be removed & added to the 1st select list i.e. the 1st select list would now have 12 options & the 2nd select list would be completely vacant. Next when the checkbox is unchecked, the 2 select lists should revert back to their original state ie. the 1st select list should now have 3 options (Jan, Feb & Mar) & the 2nd select list would have the rest of the 9 months as the options. How do I do this? Please note that it is not mandatory for the 1st select list to have only 3 options; it can be lesser than 3 or greater than 3 & the months can be any month (not necessarily Jan, Feb & Mar) but whatever options the 1st select list will be having, those options will never be available in the 2nd select list & vice-versa.

Thanks,

Arpan
 
Hi Arpan,

I think this example I wrote you can get you started:

Code:
<HTML>
<HEAD>
  <SCRIPT LANGUAGE=&quot;JavaScript&quot;>
    function halfYear() {
      document.all.f1.qtr.style.display = 'none';
      document.all.f1.halfyr.style.display = 'block';
    }
    function quater() {
      document.all.f1.halfyr.style.display = 'none';
      document.all.f1.qtr.style.display = 'block';
    }
  </SCRIPT>
</HEAD>

<BODY>
  <INPUT TYPE=&quot;radio&quot; NAME=&quot;listsize&quot; onClick=&quot;quater()&quot; CHECKED>Quater<BR>
  <INPUT TYPE=&quot;radio&quot; NAME=&quot;listsize&quot; onClick=&quot;halfYear()&quot;>Half Year<BR>
  <FORM NAME=&quot;f1&quot; ACTION=&quot;&quot; METHOD=&quot;&quot;>
    <SELECT ID=&quot;qtr&quot; NAME=&quot;month&quot; STYLE=&quot;display:block;&quot;>
      <OPTION VALUE=&quot;Jan&quot;>Jan</OPTION>
      <OPTION VALUE=&quot;Feb&quot;>Feb</OPTION>
      <OPTION VALUE=&quot;Mar&quot;>Mar</OPTION>
    </SELECT>
    <SELECT ID=&quot;halfyr&quot; NAME=&quot;month&quot; STYLE=&quot;display:none;&quot;>
      <OPTION VALUE=&quot;Jan&quot;>Jan</OPTION>
      <OPTION VALUE=&quot;Feb&quot;>Feb</OPTION>
      <OPTION VALUE=&quot;Mar&quot;>Mar</OPTION>
      <OPTION VALUE=&quot;Apr&quot;>Apr</OPTION>
      <OPTION VALUE=&quot;May&quot;>May</OPTION>
      <OPTION VALUE=&quot;Jun&quot;>Jun</OPTION>
    </SELECT>
  </FORM>
</BODY>
</HTML>

Hope it makes sense to you!!

Good luck §;O)


Jakob
 
Hi Jakob,

Thanks for your suggestion. There's no doubt that your idea is a good one but if I implement your idea, it would mean consuming a lot of unnecessary server resources. The reason is I am populating both the select lists dynamically from a database (for which I am using ASP). So implementing your idea would mean communicating with the database 4 times instead of the usual 2 times (for populating the 2 select lists). Any other idea????

Thanks once again,

Regards,

Arpan
 
Arpan,

There would be no obvious reason to request more from the DB more that the two times you mention. The short and the long list in my example should come from the same array -see where I'm going?

Do you know PHP? I don't use ASP, so I can't post an APS example...

Best Regards §;O)


Jakob
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top