I am new at using the Javascript API and not an upper class Javascript guy (Still learning) so I am using the examples and plugging in my specific values.What I am ultimately trying to do is create some logic pulling data from our ArcGIS server and displaying a popup with a custom link. My first step was to get a popup window working of which I used the provided ESRI example templates. http://help.arcgis.com/en/webapi/javascript/arcgis/samples/widget_extendinfowindow/index.htmlI am able to get it to run without any problems. So I use our REST service located herehttp://map.miamiconservancy.org:6080/arcgis/rest/services/MCDPropertiesJOINToSQL/MapServer/2This is where my problem starts. The map service uses some internal SQL queries and for all of our other uses for this service, there is no problems, works great. However you will notice that the Field names include a % sign. I don't know where this is added, but it is no where in the service outside of the REST services here. Permits.MASTERUSER.%PERMIT.ISSUEDTONow it is not entirely a problem because in the example when creating the Infotemplate I can set the setTitle to ${Permits.MASTERUSER.%PERMIT.LOCATION} and it works fine. In the getTextContent(graphic) function however I can not get a variable assigned from the REST fields.for example the original code line to start working with a variable is:var attr = graphic.attributes.qSpecies.replace('"',""); I can see from thier REST service http://servicesbeta.esri.com/ArcGIS/rest/services/SanFrancisco/SFStreetTreesRendered/MapServer/0that qSpecies is the Field and works. My field is Permits.MASTERUSER.%PERMIT.LOCATION and no matter how I try to encapsulate it, it fails or errors.UPDATE.. I also tried the field Properties.DBO.Permits.MCDNUM and still the the same issuesHere is my code. I hope anyone here can help me.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
<!--The viewport meta tag is used to improve the presentation and behavior
of the samples on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Street Trees</title>
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/css/esri.css">
<link rel="stylesheet" href="myModules/InfoWindow.css">
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
.esriScalebar{padding: 20px 20px; }
#map{ padding:0; }
</style>
<script>var dojoConfig = {
parseOnLoad:true,
packages: [{
"name": "myModules",
"location": location.pathname.replace(/\/[^/]+$/, "") + "/myModules"
}]
};
</script>
<script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/"></script>
<script>
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("esri.layers.FeatureLayer");
// Import my info window module.
dojo.require("myModules.InfoWindow");
var map;
function init() {
var infoWindow = new myModules.InfoWindow({
domNode: dojo.create("div", null, dojo.byId("map"))
});
map = new esri.Map("map", {
basemap: "topo",
// center: [-122.416, 37.781],
center: [-84.183, 39.734],
zoom: 13,
infoWindow:infoWindow
});
var template = new esri.InfoTemplate();
template.setTitle("<b>${Permits.MASTERUSER.%PERMIT.ISSUEDTO}</b> ${OBJECTID}");
//Tried just using a variable but the replace function is looking at the literal string and not pulling the values from the REST
var theLocation = "";
theLocation = ("<b>LOCATION: </b>${Permits.MASTERUSER.%PERMIT.LOCATION}<br>");
theLocation = theLocation.replace("'","");
theLocation = theLocation.replace("&","And");
template.setContent(getTextContent);
// tested not working template.setContent(theLocation);
var featureLayer = new esri.layers.FeatureLayer("http://map.miamiconservancy.org:6080/arcgis/rest/services/MCDPropertiesJOINToSQL/MapServer/2", {
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
infoTemplate:template,
outFields: ["*"]
});
map.addLayer(featureLayer);
map.infoWindow.resize(200, 75);
}
function getTextContent(graphic) {
// ORIGINAL EXAMPLE CODE var attr = graphic.attributes.qSpecies.replace('"',"");
//var attr = Name ;
//var names=attr.split("::");
//var commName = dojo.string.trim(names[1].replace('"',""));
//var hlink = names[0].split(" ");
//var sciName = hlink[0] + "_" + hlink[1];
// TRYING TO GET VARIABLES
// No error on load on click Error: Cannot call method 'replace' of undefined var attr = graphic.attributes.LOCATION.replace('"',"");
// Since line 55 defines the entire REST field name and works I try the following
// DOES NOT WORK var attr = graphic.attributes.Permits.MASTERUSER.%PERMIT.LOCATION.replace('"',"");
// DOES NOT WORK var attr = {graphic.attributes.Permits.MASTERUSER.%PERMIT.LOCATION.replace('"',"")};
// DOES NOT WORK var attr = graphic.attributes.{Permits.MASTERUSER.%PERMIT.LOCATION}.replace('"',"")};
// DOES NOT WORK var attr = Permits.MASTERUSER.%PERMIT.LOCATION;
// DOES NOT WORK var attr = {Permits.MASTERUSER.%PERMIT.LOCATION};
// DOES NOT WORK var attr = ${Permits.MASTERUSER.%PERMIT.LOCATION};
var commName = "TEST";
var sciName = "XXXXX";
if(commName == ""){
// commName = names[0];
}
return "<b>" + commName + "</b><br /><a target='_blank' href=http://en.wikipedia.org/wiki/" + sciName +">Wikipedia Entry</a>";
}
dojo.ready(init);
</script>
</head>
<body class="claro">
<div data-dojo-type="dijit.layout.BorderContainer"
data-dojo-props="design:'headline', gutters:true"
style="width: 100%; height: 100%; margin: 0;">
<div id="map"
data-dojo-type="dijit.layout.ContentPane"
data-dojo-props="region:'center'"
style="overflow:hidden;">
</div>
</div>
</body>
</html>