I have a javascript I would like to use with a search form, however I cannot get the form to submit the correct information (it submits nothing). I understand HTML and have been working on this javascritpt for 3 days so I am desperate.
The javascript populates the second select box based upon what is selected in the first box.
How do I pass the values from the "select" fields to the form action? Currently when I submit the form all 5 products are listed in my test database which is the same result you get by leaving the search blank.
Any help you can provide would be greatly appreciated.
Thank you
Jason
Here is all the code, I'm not sure if you just need the form section or not so here is everything.
<html>
<HEAD>
<script language="Javascript">
var arrayData = new Array();
arrayData[0] = 'SALES| 5001 Pulse Oximeter|'
arrayData[1] = 'SALES|[SAL] User 02|'
arrayData[2] = 'SALES|[SAL] User 03|'
arrayData[3] = 'MARKETING|[MAR] User 01|'
arrayData[4] = 'MARKETING|[MAR] User 02|'
arrayData[5] = 'MARKETING|[MAR] User 03|'
arrayData[6] = 'TECHNOLOGY|[TEC] User 01|'
arrayData[7] = 'TECHNOLOGY|[TEC] User 02|'
arrayData[8] = 'TECHNOLOGY|[TEC] User 03|'
function populateData( name ) {
select = window.document.form.SubCategory;
string = "";
// 0 - will display the new options only
// 1 - will display the first existing option plus the new options
count = 0;
// Clear the old list (above element 0)
select.options.length = count;
// Place all matching categories into Options.
for( i = 0; i < arrayData.length; i++ ) {
string = arrayData.split( "|" );
if( string[0] == name ) {
select.options[count++] = new Option( string[1] );
}
}
// Set which option from subcategory is to be selected
// select.options.selectedIndex = 2;
// Give subcategory focus and select it
// select.focus();
}
</script>
</HEAD>
<BODY>
<form name="form" action="method="post">
<span class=DefMenuText>Manufacturer</span><br>
<select name='category'
onChange='javascript
opulateData( this.options[selectedIndex].text )'>
<option>SALES</option>
<option>MARKETING</option>
<option>TECHNOLOGY</option>
</select> <br />
<td><span class=DefMenuText>Model</span><br>
<select name="SubCategory" style="width:250;">
</select>
<br />
<input class="button" type="submit" name="Search" value="SubCatetory" />
</form>
</body>
</html>
The javascript populates the second select box based upon what is selected in the first box.
How do I pass the values from the "select" fields to the form action? Currently when I submit the form all 5 products are listed in my test database which is the same result you get by leaving the search blank.
Any help you can provide would be greatly appreciated.
Thank you
Jason
Here is all the code, I'm not sure if you just need the form section or not so here is everything.
<html>
<HEAD>
<script language="Javascript">
var arrayData = new Array();
arrayData[0] = 'SALES| 5001 Pulse Oximeter|'
arrayData[1] = 'SALES|[SAL] User 02|'
arrayData[2] = 'SALES|[SAL] User 03|'
arrayData[3] = 'MARKETING|[MAR] User 01|'
arrayData[4] = 'MARKETING|[MAR] User 02|'
arrayData[5] = 'MARKETING|[MAR] User 03|'
arrayData[6] = 'TECHNOLOGY|[TEC] User 01|'
arrayData[7] = 'TECHNOLOGY|[TEC] User 02|'
arrayData[8] = 'TECHNOLOGY|[TEC] User 03|'
function populateData( name ) {
select = window.document.form.SubCategory;
string = "";
// 0 - will display the new options only
// 1 - will display the first existing option plus the new options
count = 0;
// Clear the old list (above element 0)
select.options.length = count;
// Place all matching categories into Options.
for( i = 0; i < arrayData.length; i++ ) {
string = arrayData.split( "|" );
if( string[0] == name ) {
select.options[count++] = new Option( string[1] );
}
}
// Set which option from subcategory is to be selected
// select.options.selectedIndex = 2;
// Give subcategory focus and select it
// select.focus();
}
</script>
</HEAD>
<BODY>
<form name="form" action="method="post">
<span class=DefMenuText>Manufacturer</span><br>
<select name='category'
onChange='javascript
opulateData( this.options[selectedIndex].text )'> <option>SALES</option>
<option>MARKETING</option>
<option>TECHNOLOGY</option>
</select> <br />
<td><span class=DefMenuText>Model</span><br>
<select name="SubCategory" style="width:250;">
</select>
<br />
<input class="button" type="submit" name="Search" value="SubCatetory" />
</form>
</body>
</html>
