i have looked at a couple of the datagrid examples now, and as far as i can see, i have all of the essential parts on my page, but i cannot seem to get the data to populate, and the grid does not seem to be picking up the style from the css.... i'm sure it is something very small (but essential) i have missed, and usually something like this just needs a second set of eyes....here is my code, and i really appreciate the views and any comments you might offer.the links and css : <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dojox/grid/resources/Grid.css">
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dojox/grid/resources/claroGrid.css">
<style type="text/css">
body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }
##toolbar { height:25px; width:960px; }
##mapCanvas { height: 615px; width:739px; float:right; }
##info { height:615px; width:220px; background-color:white; float:left; }
.showing {
background-image: url('images/checkMarkNoBorder.gif');
background-repeat: no-repeat;
width: 18px;
height: 18px;
text-align: center;
}
.showIt { background-position: 0px; }
.hideIt { background-position: -32px; }
</style>
<!--- end of page, beginning of scripting --->
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script>
<script type="text/javascript">
djConfig={
isDebug: true,
parseOnLoad: true
}
</script>
the html: <body class=" claro ">
<div id="toolbar"></div>
<div style="width:959px;">
<div id="mapCanvas"></div>
<div dojotype="dijit.layout.ContentPane" id="info">
<table dojoType="dojox.grid.DataGrid" jsid="grid" id="grid" rowsPerPage="20" rowSelector="20px">
<thead>
<tr>
<th field="HUB_ASSET_ID">Hub ID</th>
<th field="HUB_ASSET_NAME" >Name</th>
<th field="FMS_ASSET_DESCR">Description</th>
</tr>
</thead>
</table>
</div>
</div>
</body>
the js function displayInfo(assets){
//assets is an array of feature.attributes
//call comes from the showinfowindow function
//console.debug(assets);
var data={
identifier:"HUB_ASSET_ID",
items:assets
}
console.debug(data);
var grid;
var jsonStore = new dojo.data.ItemFileReadStore({data:data});
grid.setStore(jsonStore);
grid.setQuery({ HUB_ASSET_ID: '*'});
// grid.setSortIndex(1,"true");
}
function showInfoWindow(results,e){
//results is an IdentifyResult object, e is the click event
if(results.length == 0) {return;}
var r = results[0].feature;
var infoToView=[];
var content="";
var gtry = r.geometry;
var info = r.attributes;
symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]));
content+="<table>";
content+="<tr><td>ID: </td><td>"+info.HUB_ASSET_ID+"</td></tr>";
content+="<tr><td>Name: </td><td>"+info.HUB_ASSET_NAME+"</td></tr>";
content+="<tr><td>Description: </td><td>"+info.FMS_ASSET_DESCR+"</td></tr>";
content+="<tr><td colspan='2'> </td></tr>";
content+="<tr><td colspan='2' style='text-align:center;'><a href='##'>Asset Summary Page</a></td></tr>";
content+="</table>";
//if(results.length > 1){ listResults(results);}
if(results.length > 1){
for(var i=0;i<results.length;i++){
infoToView.push(results.feature.attributes);
}
displayInfo(infoToView); // <----- sends info to the datagrid
}
map.infoWindow.setTitle("Asset Found: " + info.HUB_ASSET_ID);
map.infoWindow.setContent(content);
map.infoWindow.show(e.screenPoint,map.getInfoWindowAnchor(e.screenPoint));
if(map.extent != startExtent){showFeature(r);}
}
again,thanks for looking, and i appreciate any ideas.