...

View Full Version : Javascript GET strings



timbaker1991
10-02-2011, 12:21 PM
Okay so I have this code for HMTL5 Canvas, however this is a JavaScript directed question not a Canvas question.



<script type="text/javascript">

var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.moveTo(0,400);
cxt.lineTo(50,a);
cxt.lineTo(100,b);
cxt.lineTo(150,390);
cxt.lineTo(200,300);
cxt.lineTo(250,285);
cxt.lineTo(300,299);
cxt.lineTo(350,250);
cxt.lineTo(400,325);
cxt.lineTo(450,275);
cxt.lineTo(500,300;);
cxt.stroke();

</script>
That will draw a line graph, however I want to get the coordinates from a variable in the URL. So it may be example.com/a=500&b=600 . How would I retrieve these two variables and then insert in to they're respective places?

Any help greatly appreciated, please make it as simple as possible - I'm good with my PHP now but JavaScript is all new

rangana
10-02-2011, 12:49 PM
You might find this script useful:


function getURIval( name ){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( location.href );
if( results == null ) return "";
else return results[1];
}


Assuming you have this URL:
http://www.codingforums.com/showthread.php?t=239716

...and you want to get the value from the t parameter so you call the function as:
alert(getURIval( 't' )); // returns 239716

Secondly, you have a typo on your script here (remove highlighted):


cxt.lineTo(500,300;);


Hope that helps.

ironboy
10-02-2011, 02:31 PM
@rangana : Nice function. :)

If you prefer to have your all get parameters accesible from an object (similar to PHP where they are accesible from an associative array) you can do:

var _get = (function(){
var i, p,x, obj = {};
x = location.search.slice(1).split('&');
for(var i = 0; i < x.length;i++){
p = x[i].indexOf('=');
obj[x[i].slice(0,p)] =
decodeURIComponent(x[i].slice(p+1));
};
return obj
})();

Now you can ask for the get parameters like this:

_get.x // retrieving parameter x
_get.y // retrieving parameter y etc.


And you can also loop through all the parameters:

for(var i in _get){
console.log('get parameter','name: ' + i, 'value: ',_get[i]);
}

Logic Ali
10-02-2011, 05:29 PM
If you prefer to have your all get parameters accesible from an object (similar to PHP where they are accesible from an associative array) you can do:

var _get = (function(){
var i, p,x, obj = {};
x = location.search.slice(1).split('&');
for(var i = 0; i < x.length;i++){
p = x[i].indexOf('=');
obj[x[i].slice(0,p)] =
decodeURIComponent(x[i].slice(p+1));
};
return obj
})();

It's important to handle &amp; as well.


var _get = (function()
{
var i, p, x, obj = {},
x = location.search.slice( 1 ).split( /\&(?:amp\;)?/ );

for( var i = 0; i < x.length; i++ )
{
p = x[ i ].split( '=' );
obj[ p[ 0 ] ] = decodeURIComponent( p[ 1 ] );
}

return obj;
})();

ironboy
10-02-2011, 05:41 PM
Agreed. The question is should it be handled as a separator? (Or is it intentional as part of a value?)

But if we agree on the first one your take on my code snippet is a real improvement. :thumbsup:

However I was trying to provide for multiple = between &:s (that I wanted to treat as part of the value).
You don't. Any reasoning behind this? :o

timbaker1991
10-02-2011, 07:24 PM
Thank you everyone that helped me out perfectly!

I've now got a separate question which I have titled 'Making a popup on Canvas scroll over' if any of you are able to help with that it would be greatly received.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum