Forum Moderators: open
I have a non-dynamic site with several product pages. I’ve just created an order form page with a simple cgi mail script. But I want users who browse the product pages to be able to click the "order" button, and be taken to the order page, but with several input boxes already filled in. ie.
User is on product page for "rainbow widgets" and they click the "order" button. They are then taken to the order page. On the order page, the product input box is already filled in with "rainbow widgets".
I may also need a dynamic drop down box to give the user specific options on the product they want to order.
I could do this by creating a separate form page for every single product, but I'm sure there must be a way to dynamically do it with just 1 form page. Any help would be greatly appreciated! :)
Phil
<a href="order.html" onClick="location='order.html?product=' + escape('rainbow widgets'); return false"> button here </a>
That should create a link to order.html?product=rainbow+widgets
On order.html, all you have to do is parse the query string and put some stuff in the right text field (called 'product'). It's best to call that script onLoad, as you want to be sure the field exists before you attempt writing to it.
The script:
function autoOrder() {
var ls = location.search.substr(1);
document.forms[0].product.value == (ls && (ls.substr(0,8) == "product="))?
unescape(ls.substr(8)) : "";
}
That all looks good, I have put the code in, and it looks as if it should work but doesn't :(
When I click the order button it doesn't pick up the?order.shtml?product=rainbow+widgets
I also put the javascript on the order page and changed the form box name to "product"
Could this be anything to do with using shtml documents? I have my navication and header and a news column as includes.
I will continue to tinker to see If I can crack it ;)
<a href="#" onClick="location='order.shtml?product=' + escape('rainbow widgets'); return false">
After much tweaking I finally cracked it. Code as follows.
Product page
<a href="#" onClick="location='order.shtml?product=' + escape('rainbow widgets'); return false">Order Now</a>Order form page
<script language="JavaScript" type="text/javascript"><!--
var qs = location.search.substring(1);
var nv = qs.split('&');
var url = new Object();
for(i = 0; i < nv.length; i++)
{
eq = nv[i].indexOf('=');
url[nv[i].substring(0,eq).toLowerCase()] = unescape(nv[i].substring(eq + 1));
}
//-->
</script>
<script language="JavaScript" type="text/javascript"><!--
function displayProduct() {
document.order.ORDER_requirement.value=(url["product"]);
}
//-->
</script><body onLoad="displayProduct()">
<textarea rows="4" name="ORDER_requirement" cols="40" class="formbox2"></textarea>
Phil
Ok, that script works fine offline but as soon as I put it online the "order" button does not work. If I use href="#" it simply stays on the current page and adds a # to the url. or if I use href="order.shtml" it just goes to the order page and doesn't add the string to the url :E
Maybe I need a javascript link?
