window.grid = new (declare([Grid, Selection]))({ // use Infinity so that all data is available in the grid bufferRows: Infinity, columns: { "id": {"label": "ID", "formatter": makeZoomButton}, "vehicleId": "Vehicle ID", "velocity": { "label": "Speed (MPH)", "formatter": dojoNum.format }, "timestamp": {"label": "Last Contact", "formatter": formatTimestamp} } }, "grid"); function makeZoomButton(e){ zBtn = "<div data-dojo-type = 'dijit/form/Button'><img src='images/zoom.png'"; zBtn = zBtn + "width='14' height='14'"; zBtn = zBtn + "onClick=\"selectUnit('"+e+"')\"></div>"; return zBtn }
grid.on(".field-id:click", selectUnit); function selectUnit(e) { // select the feature var flzoom = map.getLayer("units"); var query = new Query(); query.objectIds = [parseInt(e.target.innerHTML)]; flzoom.selectFeatures(query, FeatureLayer.SELECTION_NEW, function(result) { if ( result.length ) { point = result // re-center the map to the selected feature window.map.centerAndZoom(result[0].geometry, 100); } else { console.log("Feature Layer query returned no features... ", result); } }); }
Solved! Go to Solution.
Take a look at this post in GIS.StackExchange. Instead of using the formatter, it uses renderCell to put a button in a cell.