Help with script, taking vars from address bar [Archive]

Click to See Complete Forum and Search --> : Help with script, taking vars from address bar

PhilDog

01-03-2006, 02:21 AM

Ok here is my problem. I’m trying to make an external script that changes the value of an iFrame. Now what I need is to add something like a # or ? or something to not effect the direction of the url, so I won’t get a error. After that I want to take the part from there and assign it as the value of “frameID”.

The parts I want it to take are in green:
www.freewebs.com/phildog/csp/index.html?frameID=mods/robots.html

Now then what I want to do is take the selected part and make that the iFrame have that value this is what I have so far:
<script type="text/javascript">
{
var frameID = "This is where I get the part from the address bar"
document.getElementById("mainframe").src=frameID
}
</script>

I hope this isn’t too much.

Cytael

01-03-2006, 03:58 AM

you probably want to make your url something like:
www.freewebs.com/phildog/csp/index.html?page=robots

but as for how to get JS to pull the var out of the address bar, well...I'd like to know, too! :)

PhilDog

01-03-2006, 10:04 AM

Thanks updated! However I need to have the “mods/robots.html” you see when someone comes to my site and I don't want to force them to navigate themselves.

Rik Comery

01-03-2006, 10:25 AM

Try the following:
Copy the attached code into a file, and name it index.htm. Then run the page. at first, the page parameter is not set in the URL, so a default page will load. (in this case Google). If you click the link at the top, the page will reload, but this time will have the page parameter in the url. This page is then loaded into the IFrame.

<html>
<head>
<script>
var defaultPage = "http://www.google.com"; // This is the page to load if not specified in the url

function getQueryVariable(variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
}

function loadIframe(){
if(getQueryVariable("page")=="" || !getQueryVariable("page")){
document.getElementById("main").src = defaultPage;
}else{
document.getElementById("main").src = getQueryVariable("page")
}
}
</script>
</head>

<body onload="loadIframe()">
<a href="index.htm?page=http://www.webdeveloper.com">click here</a><br><br>
<iframe id="main" name="main" width="550px" height="400px"></iframe>
</body>
</html>

You can change the page parameter to whatever you want

PhilDog

01-03-2006, 10:43 AM

Kool works great! wondering two things. Can this be run in a external script? also could you show me what string pulls out the var?

Rik Comery

01-03-2006, 11:06 AM

Yes you can use an external file. Everything in the script tags above can go in the external file. everything else must remain on the main html page.

Here is the script again, with details of what each line does. Hope this is clear.

<html>
<head>
<script>
var defaultPage = "http://www.google.com"; // This is the page to load if not specified in the url

function getQueryVariable(variable) {
var query = window.location.search.substring(1); // This grabs everything after the ? in the url
var vars = query.split("&"); // This seperates all the queries. (in this example, there is only one - page=http://www.webdeveloper.com)
for (var i=0;i<vars.length;i++) { // This loops through all the split queries
var pair = vars[i].split("="); // This splits the query into Name and value. (i.e. the Name is "page" and the value is "http://www.webdeveloper.com")
if (pair[0] == variable) { // If the Name in the url is "page" stop and remember the value, otherwise, move to the next name/value pair
return pair[1];
}
}
}

function loadIframe(){
if(getQueryVariable("page")=="" || !getQueryVariable("page")){ // If the parameter "page=something" was not found, load the default page into the IFrame
document.getElementById("main").src = defaultPage;
}else{
document.getElementById("main").src = getQueryVariable("page") // If the parameter "page=something" was found, load the value into the IFrame
}
}
</script>
</head>

<body onload="loadIframe()"> 
<a href="index.htm?page=http://www.webdeveloper.com">click here</a><br><br /> 
<iframe id="main" name="main" width="550px" height="400px"></iframe>
</body>
</html>

PhilDog

01-03-2006, 11:49 AM

Thanks I removed the var defaultPage = "http://www.google.com"; and document.getElementById("main").src = defaultPage because It defeated the pourose of external script thanks!