"RootChaos" <no*****@google.com> wrote in message news:<ck**********@ctb-nnrp2.saix.net>...
Hi all,
I'm looking for a script that will initially display a first setof options
on a dropdown box, after selecting the initial, it should load another
dropdown box with a new set of values. Like selecting a category, then sub
category - and those values needs to be posted with a standard html form.
Can anyone send me some links to existing ones perhaps ?
Thanx..
RC
Your best bet is using server side code to accomplish this, but I
won't get into the pitfalls of javascript discussion. Here is a little
bit of code that accomplishes this task... it should be self
explanatory, arrayTxt is an array of the Text that is shown in the
dynamic select box, and arrayVal is its corresponding array of values.
If you want a little tutorial on this stuff, along with some browser
compatibilities, look at
http://www.quirksmode.org/js/options.html
I tested this script on Windows IE 6, and Netscape 7.1, if you click
the "Go" submit button, you should notice the querystring appended to
the URL
<html>
<head>
<script type="text/javascript">
function AChange()
{
var aSelect = document.getElementById("aSelect");
if(aSelect.value=="seth")
{
var arrayTxt = new
Array("sethText.txt","sethWeb.htm","sethDoc.doc");
var arrayVal = new Array("sethText","sethWeb","sethDoc");
AddBOptions(arrayTxt,arrayVal);
}
else if(aSelect.value=="dan")
{
var arrayTxt = new
Array("danText.txt","danWeb.htm","danDoc.doc");
var arrayVal = new Array("danText","danWeb","danDoc");
AddBOptions(arrayTxt,arrayVal);
}
else if(aSelect.value=="josh")
{
var arrayTxt = new
Array("joshText.txt","joshWeb.htm","joshDoc.doc");
var arrayVal = new Array("joshText","joshWeb","joshDoc");
AddBOptions(arrayTxt,arrayVal);
}
}
function AddBOptions(arrayTxt,arrayVal)
{
var bSelect = document.getElementById("bSelect");
bSelect.options.length=0;
if(arrayTxt.length==arrayVal.length)
{
for(var i=0;i<arrayTxt.length;i++)
{
bSelect.options[i]=new Option(arrayTxt[i],arrayVal[i]);
}
}
}
</script>
<body>
<form method="get">
User
<select id="aSelect" name="aSelect" onchange="javascript
:AChange();">
<option value="DEFAULT">Select First</option>
<option value="seth">Seth</option>
<option value="dan">Dan</option>
<option value="josh">Josh</option>
</select>
<br /><br />
Files
<select id="bSelect" name="bSelect">
<option value="DEFAULT">Select Second</option>
</select>
<input type="submit" value="GO" />
</form>
</body>
</html>
seth flowers --
http://www.charlottewebdev.com