Forum Moderators: open
example.com/request.html?product=widget72
When the page "request.html" is opened, I am able to parse out the "widget72" part of the URL using a javascript function in the head of my document as described here [webmasterworld.com].
Here's the javascript function:
function ParseAndSetField() {
var string=(location.href);
var getit=new Array();
var getit=string.split('product=');
var result=getit[1];
// remove for bug testing alert(result);
document.getElementById('product').value = result;
}
What I cannot figure is how to cause a menu on the request.html page with the name "product" have "widget72" be initially selected. I think I would call the javascript function from within the body of the page with something like this:
<select name="product" id="product">
<option selected="selected">Choose a product...
<option value="widget72">Widget 72
</select>
<script language="JavaScript" type="text/JavaScript">
ParseAndSetField();
</script>
But of course, it's not actually working. :) Add to that I have no clue why it isn't working, and I'm looking at being up *some* creek without a paddle.
Thanks in advance for any help you can provide!
if (location.search.length > 0) {
launchString = location.search.substring(1, location.search.length);
var launchStringArray = launchString.split("&");
for (var i = 0; i <= launchStringArray.length - 1; i++) {
var left = launchStringArray[i].substring(0, launchStringArray[i].indexOf("="));
var right = launchStringArray[i].substring(launchStringArray[i].indexOf("=") + 1, launchString.length);
if (isNaN(right)) {
right = '"' + right + '"';
}
eval("var " + left + " = " + right);
}
}
Secondly: Start off with all options unselected. You can then make an option selected by setting it's .selected property in JavaScript, for example:
document.myForm.product[2].selected = true;
As for working out which one to make selected, you could build a for loop to look at each option value in turn and check if it matches the desired value.
Now to the next part, the loop to look at each option value and check if it matches the value...
I have this code in the body of the page:
<script language="JavaScript" type="text/JavaScript">
for (i=0; i < document.form.productoptions.length; i++) {
if (document.form. productoptions[i].value == product) {
document.form. productoptions[i].selected = true;
}}
</script>
And it all works beautifully! :D
obj - the name of the variable
dest - the ID of the select menu/list you want to have selected
area - the ID of the form on the page
Here's the new script, placed in the head of the html (add appropriate script tags):
function Choose(obj,dest,area) {
len = document.forms[area].elements[dest].length;
for (i=0; i < len; i++) {
if (document.forms[area].elements[dest][i].value == obj) {
document.forms[area].elements[dest][i].selected = true;
}}
}
Here's the code you use in the body of the html, after the form:
<script language="JavaScript" type="text/JavaScript">
Choose(product,"productlist","orderform");
Choose(color,"colorlist","orderform");
</script>
Caveat -- The dest and area arguments must include double quotes while the obj argument cannot have any at all.
Extra thanks to Joshie76 from this thread [webmasterworld.com]. :D