URL Parameters

[AndyBurns]

Hi All

Does anyone have any documentation or any ideas about what URL parameters we can pass to the javascript API?

thanks

[derekswingley1]

This is pretty vague...what do you want to do? The JS API doesn't really handle URL parameters but the REST API does.

[JordanBaumgardner]

lol, Me: Well that's a big flippn question! Gotta see what the answer is ; )

[AndyBurns]

A user can search for a address in a application and once a address is selected from a list etc it will fire up the mapping application created by the API and zoom to the relevant x/y co ords on the map.

If you know of any documentation to help, please let me know.

thanks

[derekswingley1]

I don't think there's any native functionality in the API to help you here. But this wouldn't be too hard to do yourself. Check out window.location and dojo.queryToObject.

[BrettLord-Castillo]

There is no native functionality. Here's how I did it for our page. I'll step through with comments the basic functionality for zooming to a passed extent.
What is not in this code, is that I have a widget that, when loaded, checks to see if there is a value for urlargs.xa. If there is, then it geocodes that value and uses that result to zoom and center the map.
This should get you up and running with url arguments in general though
Notice that buildUrl has references to a lot of widgets not discussed here. This should give you a general idea of how to pattern your widgets for url arguments.

function buildUrl() { //This function constructs a url argument to use when passing shared urls. var mext, dfrom, dto, ll, ur, xa, xg, xf, xt, ct;
 mext = dijit.byId("map").getMap().extent;
 dfrom = dijit.byId("dateFrom").value;
 dto = dijit.byId("dateTo").value;
 ll = "" + mext.xmin + "," + mext.ymin;
 ur = "" + mext.xmax + "," + mext.ymax;
 xa = dijit.byId("sp").searchaddress;
 xg = dijit.byId("gmSelectAreas").value;
 xf = "" + (1 + dfrom.getMonth()) + "+" + dfrom.getDate() + "+" + dfrom.getFullYear();
 xt = "" + (1 + dto.getMonth()) + "+" + dto.getDate() + "+" + dto.getFullYear();
 ct = dojo.cookie("ct");
 //return window.location.protocol + "//" + window.location.host + window.location.pathname + "?" + dojox.encoding.crypto.Blowfish.encrypt("ll=" + ll + "&ur=" + ur + ((xa) ? "&xa=" : "") + xa + ((xg) ? "&xg=" : "") + xg + "&xf=" + xf + "&xt=" + xt + "&ct=" + ct, "slcpd");
 return window.location.protocol + "//" + window.location.host + window.location.pathname + "?ll=" + ll + "&ur=" + ur + ((xa) ? "&xa=" : "") + xa + ((xg) ? "&xg=" : "") + xg + "&xf=" + xf + "&xt=" + xt + "&ct=" + ct;
}

function getValuesFromURL(name,urlstring)
{ //Utility function for finding a url argument in a url. See how it is used below.
    //Use RegExp to clean up the URL and to search for the given parameter
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regexS = "[\\?&]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec(urlstring);
    if (results === null) {
        return "";
    } else {
        return (results[1]);
    }
}
//In body of main code for page
  var sstring = window.location.search;
  urlargs = {
   ll: dojo.map(getValuesFromURL("ll", sstring).split("%2c"),function(x) { return parseFloat(x);},this), //Lower left
   ur: dojo.map(getValuesFromURL("ur", sstring).split("%2c"),function(x) { return parseFloat(x);},this), //Upper right
   xa: getValuesFromURL("xa", sstring).split("+").join(" "), //Search Address
   xg: getValuesFromURL("xg", sstring), //geokey to a specific location
   xf: new Date(Date.parse(getValuesFromURL("xf", sstring).split("+").join(" "))), //Date from
   xt: new Date(Date.parse(getValuesFromURL("xt", sstring).split("+").join(" "))), //Date to
   xs: getValuesFromURL("xs", sstring), //Sort by
   xk: getValuesFromURL("xk", sstring),  //Skin
   ct: getValuesFromURL("ct", sstring) //Crime Types
  };
  urlargs.xf = (urlargs.xf > 0) ? urlargs.xf : "";
  urlargs.xt = (urlargs.xt > 0) ? urlargs.xt : "";

//This part is wrapped in a large try...catch because bad arguments can throw errors
   if (urlargs.xs) {
    dojo.cookie("xs", urlargs.xs);   
   }

//Then still yet farther down, when I am creating the map object
   options = {
    extent: urlargs.urlextent || urlargs.initextent
    //There is more, but that is the key part for extent
   };
//And then I pass that options object as the 2nd argument when creating the map


   if (urlargs.ll[0] && urlargs.ll[1] && urlargs.ur[0] && urlargs.ur[1]) {
    urlargs.urlextent = new esri.geometry.Extent({
     "xmin": urlargs.ll[0],
     "ymin": urlargs.ll[1],
     "xmax": urlargs.ur[0],
     "ymax": urlargs.ur[1],
     "spatialReference": {
      "wkid": 102113
     }
    });
   } else {
    urlargs.initextent = new esri.geometry.Extent({
     "xmin": -10137766.624432003,
     "ymin": 4628644.247807602,
     "xmax": -9998498.358896358,
     "ymax": 4711960.608638476,
     "spatialReference": {
      "wkid": 102113
     }
    });
   } 

[BernieConnors]

In my humble opinion ESRI should add functionality to each of the APIs (JavaScript, Flex, and SilverLight) so that url parameters can be handled in the same away for each API.  If you agree you can promote this idea:

http://ideas.arcgis.com/ideaView?id=087300000008F4Y&returnUrl=%2Fapex%2FideaList%3Fc%3D09a300000004x...

Thanks,
Bernie.

[AxelSchaefer]

This has been described more than 2 years ago in the "Pass Map Extent Parameters from one page to another in Javascript API" example at the Resources Gateway: http://resources.esri.com/arcgisserver/apis/javascript/arcgis/index.cfm?fa=codeGalleryDetails&script...

Normally, URL parameters should be handled by a server component, not a client component. JS Apis in general are client components. The only server component for the JS API client is the webserver URL to download the API. Later you may access several GIS application servers but that's out of scope of the general architecture of a JS API client.

In the last years of internet protocols and usage there was a common idea that URL parameters are handled in the backend of a server component, maybe ASPX, JAVA, PHP, Perl or some other environment. The URL parameters are parsed, processed and the result passed back to the client.

JavaScript clients running in a webbrowser don't have a similar concept for handling URL parameters except doing it the JavaScript way: accessing it over the DOM and windows.location.href. That's all. Go up the DOM until you are at the browser location bar and grab the text in it. In theory you even don't have to write a '?' and '&' signs. You can type anything behind that because the way JS accesses it is not depending on a protocol definition. Although the hosting webserver of the JS app would be irritated and that's the only reason to adapt this HTTP concept.

Best regards.
Axel

[GlenRhea]

I think the parent was talking about parsing URL parameters in the browser, yall are making too much of it. Here is the function I use:

function getUrlParam(name, url) { // optionally pass an URL to parse
 if (!url) url = window.location.href;        // if no parameter url is given, use the page URL
 name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");   // instruction needed if we want to extract an array
 var results = new RegExp("[\\?&]"+name+"=([^&#]*)").exec(url);
 if( results == null ) 
  return null;         // if the name is not found, return null
 else // decodeURIComponent doesn't recognize '+' as encoding for space
  return decodeURIComponent(results[1].replace(/\+/g," ")); 
}

Which I got from here:
http://www.netlobo.com/comments/url_query_string_javascript (about half way down, search for "gup")

It is more flexible that the one I wrote and most of the ones I've found on the net, you can use it to check for params, assign them, encode a URL within the app and it handles spaces or (+) better.

[BulbulMajumder1]

Hi there Can I see how you have been used this code?