Dynamic insertion of information from URL

embeebutterly

12-11-2011, 04:58 PM

Hey all, i could really use some help in making life easier if any one can help.

Im gonna try my best and explain what i want but please excuse my lack of knowledge!

What i want to achieve is to use one page as a template that can take information from the url and use it to produce the result i want for example

if the template page is template.html ad it looked something like this:

<title> + title + </title>
</head>

<body>
<a href="http://www.mywebsite.com/ + folder + / + page +">Click Here</a>
</body>
</html>

The link to the page could look something like this:

template.html?folder=football&page=united.html&title=United Scores

this would result in the template page rendering as:

<title>United Scores</title>
</head>

<body>
<a href="http://www.mywebsite.com/football/united.html">Click Here</a>
</body>
</html>

If anyone can tell me how i can achieve this i would be extremely grateful.

Thanks :thumbsup:

Old Pedant

12-11-2011, 08:05 PM

Not hard.

I would do it thus:

<html>
<head>
<title>Generic Title</title>
<script type="text/javascript">
// parse the querystring and create a dictionary of terms for later use:
var qs = [ ]; // where the dictionary goes

if ( location.search.length > 1 )
{
var pairs = location.search.substring(1).split("&");
for ( var p = 0; p < pairs.length; ++p )
{
var pair = pairs[p].split("=");
qs[pair[0]] = unescape( pair[1] );
}
}

// do the replacements *after* page is loaded, for simplicity:
function doReplacements( )
{
document.title = qs["title"];

document.getElementById("heading").innerHTML = qs["title"];

var link = document.getElementById("link1");
link.href = "http://www.mywebsite.com/" + qs["folder"] + "/" + qs["page"] + ".html";
link.innerHTML = qs["page"];

// and of course you could do any other replacements, too.
}
window.onload = doReplacements;
</script>
</head>
<body>
<center><h1 id="heading">Generic Heading</h1></center>
<br/><br/>
<a id="link1">Generic Link</a>
<br/><br/>
</body>
</head>

Then test that using

template.html?folder=football&page=United&title=United Scores

(Notice that I left the ".html" off of the page, so that I could use it for two purposes. You can change that as you want, of course.)

embeebutterly

12-11-2011, 08:17 PM

This looks wonderful Old Pedant!

I had a little play with it and it looks perfect. Im gonna try and incorporate it into my site and with fingers crossed it will do the job i wanted it to, as for what i asked, you hit the nail on the head. If you dont mind, i may have to post back here if i get stuck, but for all future readers, this is Perfect!

embeebutterly

12-11-2011, 08:23 PM

is there any way to keep echoing the url as a url only?

Old Pedant

12-11-2011, 09:02 PM

which url?

This one?

"http://www.mywebsite.com/" + qs["folder"] + "/" + qs["page"] + ".html";

Sure. Just make a minor special case out of it.

<script type="text/javascript">
// parse the querystring and create a dictionary of terms for later use:
var qs = [ ]; // where the dictionary goes

if ( location.search.length > 1 )
{
var pairs = location.search.substring(1).split("&");
for ( var p = 0; p < pairs.length; ++p )
{
var pair = pairs[p].split("=");
qs[pair[0]] = unescape( pair[1] );
}
}
var targeturl = "http://www.mywebsite.com/" + qs["folder"] + "/" + qs["page"] + ".html";

And then just use the variable targeturl any place on the page where you need that.