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 bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

drop down question

Status
Not open for further replies.

riffy

Programmer
Mar 29, 2001
106
US
Hi guys,

I posted last week too but I didn't get an answer...I've been trying to fix this problem that I have but with no luck...

I have two drop-downs, when you select an option in one, it populates the other using a javascript file...the first dropdown has 4 options say A,B,C and D...selecting any of the 4 populates the second drop-down with 2 options: bases, lamps...my question is whether it is possible that when a user selects either bases or lamps, it brings up a page which has a different name? for example: the user selects A and then bases and clicks on submit...now is it possible that the page that comes up is called test.html?

thanks
Arif :-I
 
you wrote...

"...I have two drop-downs, when you select an option in one, it populates the other using a javascript file..."

can you show me the script? i have a similar post, but i want to know thow to dynamically change the contents...if you show me, i return the favor...

- spewn
 
sure spewn,

this is the code for the html file:

Code:
<!--#include virtual=&quot;advancedsearch.js&quot;-->
<table width=&quot;164&quot; border=&quot;0&quot; cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; background=&quot;images/leftnav.jpg&quot;>
<tr> 
<td width=&quot;5&quot;> </td>
<td width=&quot;159&quot; height=&quot;315&quot;> 
<script language=&quot;javascript&quot;>
<!--
function Links() {
 switch (type) {
  case &quot;0&quot;:
   if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Bases') {
    document.location.href = '/radiant/flu_bases.html'; }
   else if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Lamps') {
    document.location.href = '/radiant/flu_lamps.html'; }
   break;
  case &quot;1&quot;:
   if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Bases') {
    location.href = '/radiant/inc_bases.html'; }
   else if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Lamps') {
    location.href = '/radiant/inc_lamps.html'; }
   else if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Filaments') {
    location.href = '/radiant/inc_filaments.html'; }
   break;
  case &quot;2&quot;:
   if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Lamps') {
    location.href = '/radiant/com_lamps.html'; }
   break;
  case &quot;3&quot;:
   if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Bases') {
    location.href = '/radiant/hid_bases.html'; }
   else if (document.selectform.infomenu[document.selectform.infomenu.selectedIndex].value = 'Lamps') {
    location.href = '/radiant/hid_lamps.html'; }
   break;
 }
}
//-->
</script>
<form method=&quot;get&quot; name=&quot;selectform&quot; onSubmit=&quot;return Links()&quot;>
<br>
<font face=&quot;Arial, Helvetica, sans-serif&quot; size=&quot;2&quot;><b>Lamp Family:</b></font><br>
 <select name=&quot;select&quot; onChange=&quot;Dropdown(this.form.select.options[this.form.select.selectedIndex].value)&quot;>
  <option value=&quot;&quot;>Select Lamp Family</option>
  <option value=&quot;0&quot;>Fluorescent</option>
  <option value=&quot;1&quot;>Incandescent</option>
  <option value=&quot;2&quot;>CFL</option>
  <option value=&quot;3&quot;>HID</option>
 </select>
<br>
<font face=&quot;Arial, Helvetica, sans-serif&quot; size=&quot;2&quot;><b>Properties:</b></font><br>
 <select name=&quot;infomenu&quot;>
  <option value=&quot;&quot; selected>Select Family First</option>
  <option></option>
  <option></option>
  <option></option>
  <option></option>
  <option></option>
  <option></option>
  <option></option>
 </select>
<br>
 <input type=image src=&quot;/radiant/database/images/search_new.gif&quot; width=&quot;62&quot; height=&quot;22&quot; name=&quot;image&quot; border=&quot;0&quot;>
</form>
<script language=&quot;JavaScript&quot;>
<!--
document.selectform.reset();
//--></script>
</td>
</tr>
</table>

here is advancedsearch.js, the file that populates the second drop-down and is called by the html file:

Code:
<script src='menuarrays.js' language=javascript></script>
<script language=javascript>
<!--
typeselected=0;
function initialize() {
 document.selectform.infomenu.options[0].text = &quot;Select Family First&quot;;
};

function Dropdown(type) {
 if (type) {
  //Populate Property Dropdown
  document.selectform.infomenu.options.length = info[type].length + 1;
  document.selectform.infomenu.options[0].text = &quot;Select Property&quot;;
  for(var i=0; i<info[type].length; i++) {
   document.selectform.infomenu.options[i + 1].text = info[type][i];
   document.selectform.infomenu.options[i + 1].value = info[type][i];
  }
  document.selectform.infomenu.selectedIndex = 0;
 } 
 else { 
  initialize(); return false; 
 }
}
//-->
</script>

finally this is menuarrays.js the file with the options for the second dropdown that is called by advancedsearch.js:

Code:
info = new Array(4);
info[0] = new Array(&quot;Bases&quot;, &quot;Lamps&quot;);
info[1] = new Array(&quot;Bases&quot;, &quot;Lamps&quot;, &quot;Filaments&quot;);
info[2] = new Array(&quot;Lamps&quot;);
info[3] = new Array(&quot;Bases&quot;, &quot;Lamps&quot;);

hope that helps...
arif
 
any suggestions for my original post?
 
Use the same type of code that you use for checking the value of the first list box to check the second as well, and depending on the values, set a variable called, for example NextPage. Then, execute this:
Code:
document.location = NextPage;
Tracy Dryden
tracy@bydisn.com

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.
 
hey tracy,

thanks for ure input however i am checking for the value in the second listbox originally...selectform.infomenu is the second listbox

but should i set up another for statement, looping thru the 4 values and then if statements for each value it comes across?
like this maybe:
Code:
function newPage(type) {
 for (var j=0; j<info[type].length; j++) {
  if type=0 {
   document.location.href='page.html'; }
 }
}
 
Tip: In C++ and JavaScript, if you have only one statement that is called by a loop or a conditional, you can exclude the curly braces:

Syntax: Use parentheses to enclose the condition in
Code:
if
statements.

Syntax: If you are testing for equality, use &quot;==&quot; instead of &quot;=&quot;. example:
Code:
if (type == 0);

Code: I don't quite understand why you would have your condition just test if a single variable is a single value, when that variable is not even affected by the loop.

I am not quite sure about what exactly you want function
Code:
newPage()
to do, and reading through all this is too tedious... So here's my understanding of the function you wanted:
Code:
function newPage(type) {
 for (var j = 0; j < info[type].length; j++)
  if (info[type][j] == 0)
   document.location = 'page.html';
}
 
Regardless of the details of which control to check when and how, the important part was the document.location bit. The rest you seem to have OK.

Regarding the omission of curly brackets: it make be a little easier, but not as maintainable. If you add another statment and forget to add the curly brackets too, things will be broken. It's a lot easier to maintain the code if the curlies are already there to start with. Also, I'm used to perl coding where they're always required, so I just always put them in out of habit. But it seems to me to be a GOOD habit. Tracy Dryden
tracy@bydisn.com

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top