mixing 1 2 level combobox javascript

**jackam** · 02-24-2015, 09:49 AM

Hi
I am using 2-level combo box, JavaScript Kit
, and it is working just fine.
I now need to change this script to act as a 1 level drop box on some of my listed item since they have no sub category.
Would be grateful for someone to suggest a change to the script so when a user selects and item it goes straight to a website rather than showing a 2nd category.
Thanks in advance.

**jackam** · 02-24-2015, 11:02 AM

Originally Posted by jackam

Hi
I am using 2-level combo box, JavaScript Kit
, and it is working just fine.
I now need to change this script to act as a 1 level drop box on some of my listed item since they have no sub category.
Would be grateful for someone to suggest a change to the script so when a user selects and item it goes straight to a website rather than showing a 2nd category.
Thanks in advance.

Script is from http://www.javascriptkit.com/script/...velcombo.shtml.
<form name="dynamiccombo">
<select name="stage2" size="1" onChange="displaysub()">
<option value="#">This is a place Holder text </option>
<option value="#">This is a Place Holder text </option>
<option value="#">This is a Place Holder text </option>
<option value="#">This is a Place Holder text </option>
</select>
<input type="button" name="test" value="Go!"
onClick="gothere()">
</form>

<script>

</script>

<p align="center">This free script provided by<br />
<a href="http://javascriptkit.com">JavaScript
Kit</a></p>

**vwphillips** · 02-24-2015, 11:28 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
</head>

<body>
<form name="dynamiccombo">
<select id="stage2" name="stage2" size="1" onchange="displaysub('stage2')">
</select>
<input type="button" name="test" value="Go!"
onclick="displaysub('stage2')">
</form>

<script type="text/javascript">
<!--

//2-level combo box script- by javascriptkit.com
//Visit JavaScript Kit (http://javascriptkit.com) for script
//Credit must stay intact for use

//STEP 1 of 2: DEFINE the main category links below
//EXTEND array as needed following the laid out structure
//BE sure to preserve the first line, as it's used to display main title

var category=[];
category[0]=new Option("SELECT A CATEGORY ", ""); //THIS LINE RESERVED TO CONTAIN COMBO TITLE
category[1]=new Option("Webmaster sites", "combo1");
category[2]=new Option("CNN","http://www.cnn.com");
category[3]=new Option("Entertainment", "combo3");

//STEP 2 of 2: DEFINE the sub category links below
//EXTEND array as needed following the laid out structure
//BE sure to preserve the LAST line, as it's used to display submain title

var combo1=[];
combo1[0]=new Option("Select");
combo1[1]=new Option("JavaScript Kit","http://javascriptkit.com");
combo1[2]=new Option("Dynamic Drive","http://www.dynamicdrive.com");
combo1[3]=new Option("Freewarejava.com","http://www.freewarejava.com");
combo1[4]=new Option("Free Web Templates","http://www.freewebtemplates.com");
combo1[5]=new Option("Web Monkey","http://www.webmonkey.com");
combo1[6]=new Option("BACK TO CATEGORIES","category");   //THIS LINE RESERVED TO CONTAIN COMBO SUBTITLE


var combo3=[];
combo3[0]=new Option("Select");
combo3[1]=new Option("MTV","http://www.mtv.com");
combo3[2]=new Option("ETOnline","http://etonline.com");
combo3[3]=new Option("BACK TO CATEGORIES","category");   //THIS LINE RESERVED TO CONTAIN COMBO SUBTITLE


function populate(id,selectedarray){
 var cacheobj=document.getElementById(id);
 if (cacheobj&&selectedarray instanceof Array){
  cacheobj.options.length=0;
  for (var i=0;i<selectedarray.length;i++){
   cacheobj.options[i]=new Option(selectedarray[i].text,selectedarray[i].value)
  }
  cacheobj.options[0].selected=true
 }
}

function displaysub(id){
 var cacheobj=document.getElementById(id);
 if (cacheobj&&cacheobj.options[0]){
  var selectedarray=window[cacheobj.value];
  if (selectedarray instanceof Array){
   populate(id,selectedarray);
  }
  else if (cacheobj.value){
   window.top.location=cacheobj.value;
  }
 }
}



//SHOW categories by default
populate('stage2',category);

//-->
</script>

<p align="center">This free script provided by<br />
<a href="http://javascriptkit.com">JavaScript
Kit</a></p>
</body>

</html>

**jackam** · 02-24-2015, 12:08 PM

What a fantastic piece of coding. It worked 1st time and such a quick reply.
So grateful to you.
If I may ask you 1 more favour please.
How do I style 1 line of text in a category to stand out? i.e. change color of text, italic etc?