How to make a hyperlink point to different url based on a read cookie value?

Question

Scenario

On my website I have links to "contactus.html" page on every single page's menu ( the usual Services, About Us, Contact Us menu) , and each page is made using a dreamweaver template and the menu is only editable in the .dwt template file itself itself .

When the user visits the "index.html" the first time a cookie , called "client-location" is placed with the client's location.

The Desired Outcome:

When the client clicks the Contact Us menu item, I would like to read the client-location cookie and send the user to the right contact page, e.g. contactus2.html or contactus3.html.

I got this from the stackoverflow answer in the link below . Something like this will go in the script.js file

{
    document.getElementById("contactlink").onclick = function() {
    var clientlocation = readCookie(); // this returns contact1.html, a weblink

    document.getElementById("contactlink").href=clientlocation; 
}

Possible Issue:

It is entirely possible that the user, when he/she visits the site the first time goes straight to , say About Us section, and the cookie won't be placed to mention their location at all. In that case I would like to go to contatus1.html , which is a generic contact us page.

And what if the javascript is disabled, then the browser won't even go anywhere upon a click.

I read up online and checked this How to change href of <a> tag on button click through javascript as well, but I am wondering if a) there will be any accessibility issues b) if that is a good approach

score 2 · Accepted Answer · edited May 23 '17 at 11:57

2

Surely your "Contact Us" page would have a fixed location? This seems like an unnecessary use for a cookie to me.

example.com/ContactUs could be referenced from example.com/stuff/About by linking to ../ContactUs, etc.

Equally you could pull the document root by using location.protocol + '//' + location.host (returning example.com here) and appending the necessary page.

var clientlocation = location.protocol + '//' + location.host + '/ContactUs';
document.getElementById("contactlink").href=clientlocation;

edited May 23 '17 at 11:57

Community

1
1

answered Mar 15 '13 at 14:08

James Donnelly

126,410
34
208
218

thanks , but no the contact us page has multiple locations, we have several collection points across city and showing the localized version of site to the client is essential so they know they are dealing with a local company and not a citywide company. – iAteABug_And_iLiked_it Mar 15 '13 at 14:49
1

Ah I see, now I understand what you meant by "client location cookie". :) I think in this case it would be better to link everyone to one Contact Us page, but on that page perform the location checks and modify the content accordingly there (be it through front-end or back-end). This way you'd rule out any confusion when a user visits your Contact Us page from an external site (e.g. a forum post featuring a "You can contact them at `.../contactus2.html`"). – James Donnelly Mar 15 '13 at 15:01
I think this is the better approach so i'll accept this answer, i'll probably use javascript to check for the location cookie, if it is not there or javascript is disabled then do nothing( so the generic page shows as is) , but if the cookie is there then change the address with js.:) thx – iAteABug_And_iLiked_it Mar 15 '13 at 16:16

score 0 · Answer 2 · answered Mar 15 '13 at 14:12

0

If javascript is disabled, then there is nothing you can do. Javascript will just not execute. This flow can be handled browser-independent by a server-side script.

answered Mar 15 '13 at 14:12

Dragos

1,824
16
19

score 0 · Answer 3 · answered Mar 15 '13 at 14:12

0

Can't you set the href of the link to contactus1.html, so that if JS is disabled the link will still work? And as for the cookie not being set, you can just check if clientLocation is null (or blank or whatever your readCookie function returns) and, if so, set the href to contactus1.html.

answered Mar 15 '13 at 14:12

Bafsky

761
1
7
16

yes you're right , that would be a simple solution but if the script is disabled , then even if the href to the link is specified in tag, browser goes nowhere at all. I tried that:( – iAteABug_And_iLiked_it Mar 15 '13 at 14:56
The link should work if script is disabled. Can you share your html? – Bafsky Mar 15 '13 at 15:32

score 0 · Answer 4 · answered Mar 15 '13 at 14:13

0

Well one way to solve this would be using PHP.

Like you said if users browser doesn't support JS or just doesn't have it on it wouldn't work, so a server-side solution might be better.

for example:

<?php

function generateLink($location)
{
 switch($location)
 {
  case 0:
   echo '<a href="location1.html">Contact us</a>';
   break;
  case 1:
   echo '<a href="location2.html">Contact us</a>';
   break;
 }
}

?>

answered Mar 15 '13 at 14:13

LordShigi

25
1
4

this sounds pretty close to the solution. but i want to CHANGE the href of the link , not echo it. You probbaly use it simplify the explanation but the actual requirement is to make the client go to contactus2 or contactus3 html file if cookie is place and location is known, and if no cookie is placed then go to contactus1.html which is generic. – iAteABug_And_iLiked_it Mar 15 '13 at 14:51

How to make a hyperlink point to different url based on a read cookie value?

4 Answers4