PDA

Click to See Complete Forum and Search --> : Can Javascript Change The Destination URL (Link) On a Button?

blastbum
10-06-2004, 12:22 PM
Hi,

I was wondering whether it was possible for Javascript to change the destination URL or link on a button, depending from what page you came from.

For example, let's just say that the name of the page that has the button on it is called "cart.html" and the button is called "Continue Shopping" that currently has a link on it "<#referer#>". What I want is that if traffic arrived at "cart.html" from a page called "ordernow.htm", then the Javascript will pick that up and swap the link "<#referer#>" on the button with "ordernow.htm".

To understand my situation a lot clearer, then click here (http://www.caesarscoffee.com.au/ordernow.htm):
Follow the links to the shopping cart.

1. (ordernow.htm) ---> 2. (pop-up) ---> 3. (cart.html)

Once you're at the shopping cart, click "continue shopping".

Now you see my problem!! Because there are other areas of the site that link to the cart.html page (that I want the "<#referer#>" link to work on), I've got a problem with the "referer" linking back to the pop-up when people order from the "ordernow.htm" page. I want it to link back to the "ordernow.htm" page.

I know a bit about Flash ActionScript, and since it is very similar to Javascript, I will try and explain what I'm trying to get the button to do in a hybrid ActionScript/JavaScript:

On the pop-up (eg "001.htm"), there should be Javascript resembling something like:

fromOrdernow = "true";
On the "cart.html" page, something like:

if (fromOrdernow == true) {
getURL("ordernow.htm");
} else {
getURL("<#referer#>");
}
Is this making sense to anybody?

If it is, then I would GREATLY appreciate it if you could help me out.

Many, many thanks!

Dan :)
age13kid
10-06-2004, 02:00 PM
ok you may need to change this cause i got it from the javascript SOURce.


<!-- ONE STEP TO INSTALL MUST VISIT FROM....:

1. Copy the coding into the HEAD of your HTML document -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
var requiredfrom = "index.html"; // required prev. page
if (document.referrer.indexOf(requiredfrom) == -1) {
alert("You must come to this page from " + requiredfrom);
window.location=requiredfrom;
}
// End -->
</script>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size: 0.62 KB -->
age13kid
10-06-2004, 02:02 PM
instead of making you go back a page make it go to a different page
HaganeNoKokoro
10-06-2004, 02:37 PM
It would be best for this to be done on the server-side, in the same place where the <#referer#> is substituted for a real page. If the referer page is 3 numbers followed by ".htm" then it should put http://www.caesarscoffee.com.au/ordernow.htm as the href for the link, otherwise use the actual referer.

That said, it could be done with javascript. You would need to give the link an id, so the javascript can find and deal with it (In my example, I will use the id="link_id"). Then you would put a script right below the link, something like this:

<a id="link_id" href="<#referer#>" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Continue Shopping','','../ContShop-2.jpg',1)">
<img src="../ContShop-1.jpg" name="Continue Shopping" width="135" height="21" border="0">
</a>
<script type="text/javascript">
var lnk=document.getElementById("link_id");
if(/[\d]{3}\.htm/.test(lnk.href)) lnk.href="http://www.caesarscoffee.com.au/ordernow.htm";
</script>


What it's doing is checking the link's href see if the page filename is 3 numbers followed by ".htm" If it finds that it is, it will replace the href with the ordernow page, Otherwise it will leave it alone.

You should have a chat with whoever designed the site, because it only works in Internet Explorer. I couldn't even get to the checkout page in Netscape or Firefox, except by typing its url directly into my address bar. Even then, although I had attempted to add items, It stll registered an empty cart.
agent_x91
10-06-2004, 02:40 PM
you can easily change where an <a> tag points to with the statement

name.href="new href";

for instance, below, the first link originally points you to "go.html", but when you click the second link it points you to "stop.html"...



<a href="go.html" name="hi">go</a><br><br>
<a href="#" onClick="hi.href='stop.html';">change</a>
javaNoobie
10-06-2004, 08:47 PM
always use document.getElemenyById().

agent_x91's solution i believe only works on IE?
agent_x91
10-07-2004, 01:09 PM
thanks javaNoobie. yeah, you're probably right. I'd only seen that function when I visited this forum, but I usually only program for IE anyway. I'll remember to use that in future, lol...
agent_x91
10-07-2004, 01:11 PM
Originally posted by javaNoobie
always use document.getElemenyById().

agent_x91's solution i believe only works on IE?

I assume it was a typo, but it's getElementById()

;) :rolleyes:
blastbum
10-08-2004, 03:14 AM
Hi guys,

Firstly I really appreciate your help and support on this issue.

I took HaganeNoKokoro's script and placed in the following places, but it didn't work:

I put:
<a id="link_id" href="<#referer#>" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Continue Shopping','','../ContShop-2.jpg',1)">
<img src="../ContShop-1.jpg" name="Continue Shopping" width="135" height="21" border="0"></a><img src="../CartSpace.gif" width="15" height="3"> On the "Continue Shopping" button (on the "cart.html" page).

And I put:
<script type="text/javascript">
var lnk=document.getElementById("link_id");
if(/[\d]{3}\.htm/.test(lnk.href)) lnk.href="http://www.caesarscoffee.com.au/ordernow.htm";
</script> On the Javascript allocated section in between <HEAD> and </HEAD> (you know where!!) on the "cart.html" page.

And yep, it doesn't work. Was I suppose to put the javascript code on the pop-up pages (eg. "001.htm" etc) instead of the cart.html page?

The "cart.html" is getting errors from it as well:
Line: 35
Char: 1
Error: Syntax error
Code: 0
URL: http://www.caesarscoffee.com.au/html/cart.html?sub_type1=Beans&p=159&a=add&q=1&add=Add
When you have a look at what line it is, it's this one:
if(/[\d]{3}\.htm/.test(lnk.href)) lnk.href="http://www.caesarscoffee.com.au/ordernow.htm";
I took the code off the page because of the error, so if you wanted to look at the source code with the added new code, then you'll find it won't be there.

Any ideas as to what the issue could be?

Once again, your help is invaluable!! :D

Dan
HaganeNoKokoro
10-08-2004, 11:44 AM
Funny, the script gets no syntax errors for me. What browser (and version) are you using?

Anyway, none of it goes in the head. It goes in the body of cart.htm. On that page, there will be a link that points to the referer. You must add to that link an id attribute, id="link_id" in my example. Then, right below the link, you put the script part. it uses a regular expression to determine if the link points to a page matching the pattern "[3numbers].htm" and if it does, that means the referer should be replaced by "ordernow.htm"

Here is a simple example of the script in action. It should show you how the script works, where it goes, etc. The link target is initially set to "http://www.caesarscoffee.com.au/003.htm" (like one of your popup pages) but the javascript will replace that with "http://www.caesarscoffee.com.au/ordernow.htm" because the pattern matches.

This example is tested in IE6, FF1.0PR, and NN7

<html>
<head>
<title>Link Example</title>
</head>
<body>
<a id="link_id" href="http://www.caesarscoffee.com.au/003.htm">Click here to continue Shopping.</a>
<script type="text/javascript">
lnk=document.getElementById("link_id");
if(/[\d]{3}\.htm/.test(lnk.href)) lnk.href="http://www.caesarscoffee.com.au/ordernow.htm";
</script>
</body>
</html>
blastbum
10-08-2004, 08:30 PM
Ohhhhhhhh HaganeNoKokoro!!!!!!!!! You're my dead set hero!!!!!
I freakin worship you man!!!!! (Hansel - Zoolander)

My problem was that I was I was putting the script in with the other Javascripts in the <HEAD> section.

Here, have cold one on me!

http://www.ds-d.com/Beer.jpg

Cheers!!!

Dan :D