DISPLAY QUERY RESULTS IN A GRID/TABLE

2901
11
Jump to solution
05-30-2017 02:53 PM
LauraBusolo2
New Contributor III

I have my query results displaying as highlighted points on the map. However, I want to add the same results to display in a table as well that can be printed. Kindly assist. The results don't show up on my "created table".

  
var myGrid = declare([Grid, Selection]);

/Columns for the grid
var columns = [
    {'field': 'NAME', 'label': "Academy"},
    {'field': 'Industry', 'label': "Academy Sector"},
    {'field': 'Descr', 'label': 'Sector Description'},
    {'field': 'District', 'label': 'School District'}
    // get it from high school {'field': 'ADDRESS', 'label': 'Street Address', width:"30%"}
];

// // Creating an instance of the Grid
grid = new myGrid({
columns: columns,
selectionMode: 'single',
}, 'tableDiv');

// grid.on("dgrid-select", onRowClickHandler);
grid.on();


var query = new Query();
query.returnGeometry = true;
query.outFields = ['NAME', 'No_of_students', 'Industry', 'Descr', 'District'];

query.where = "Industry <> ''";
queryTask_AcademySec.execute(query, populateDD);

function populateDD(results) {
var CVEPindustries = new Array();
//populate drop down:
var selectObj = document.getElementById("industrySelectDD");

//Setting the value of the drop down to "Select Industry(s)" when length = 0
selectObj.options.length = 0;
var optObj = new Option("Select Industry(s)");
//changing the values to what has been selected by user in drop down
selectObj.options[selectObj.options.length] = optObj;
//looping through each feature returned
for (var i = 0, len = results.features.length; i < len; i++) {
var featureAttributes = results.features[i].attributes;
for (attribute in featureAttributes) {
var index = CVEPindustries.indexOf(featureAttributes.Industry);
if (index == -1) {
CVEPindustries.push(featureAttributes.Industry)
}

}

}
//Translate the coded values for the domain to display in a more readable context in the dropdown
IndyLibrary = {BCT:"Building and Construction Trades",
MSS: "Marketing, Sales, and Services", AGR: "Agriculture and Natural Resources", TRA: "Transportation",ART: "Arts, Media, and Entertainment", ENG: "Engineering and Architecture", FSN: "Fashion and Interior Design", HLT: "Health Science and Medical Technology", AVI: "AVID", INF: "Information and Communication Technologies", PUB: "Public Services", MAN: "Manufacturing and Product Development", FIN: "Business and Finance", NRG: "Energy, Environment, and Utilities", EDU: " Education, Child Development, and Family Services", HOS: "Hospitality, Tourism, and Recreation" };
// sorting the academy industries
CVEPindustries.sort();
for (var j = 0; j < CVEPindustries.length; j++) {
var optObj = new Option(IndyLibrary[CVEPindustries[j]], CVEPindustries[j]);
selectObj.options[selectObj.options.length] = optObj;
}

on(dom.byId("GetAcademies"), "click", executeIndQry);

function executeIndQry() {
// var selectedValue = dom.byId("industrySelectDD");
var queryString='';
var i=0;
for(option in dom.byId("industrySelectDD").options){
if(dom.byId("industrySelectDD").options[option].selected){
if(i==0){
queryString+="Industry ='" +dom.byId("industrySelectDD").options[option].value+"'"
i+=1
}else {
queryString+=" or Industry ='" +dom.byId("industrySelectDD").options[option].value+"'"}
}
}
console.log(queryString);
query.where = queryString ;
//execute the query
//queryTask_AcademySec.execute(query, showResults);
lyrAcademies.selectFeatures(query, FeatureLayer.SELECTION_NEW, function(results){
showResults(results);
// populateGrid(response);
})
}
}

//Show the results as highlighted boxes on the map
function showResults(results) {
mapMain.graphics.clear();
var selectSymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_SQUARE, 15,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255,0,0]), 1),
new Color([0,255,0,0.25]));

//*test start*
//create array of attributes from the results queried

var items = arrayUtils.mapMain(results, function (results) {
showResults(results);
});


for (result in results){
var geo= results[result].geometry;
graphicsLayer.add(new Graphic(geo, selectSymbol))
console.log(results);}

//display the results in the grid
grid.refresh();
grid.renderArray(items);
//*end test*
}

}


);


});

});


  
0 Kudos
11 Replies
BjornSvensson
Esri Regular Contributor

Laura, have you considered using the FeatureTable widget from the API?

FeatureTable | API Reference | ArcGIS API for JavaScript 3.20 

LauraBusolo2
New Contributor III

I haven't tried it yet, Bjorn. Will it allow me to  get related records on the table, and print the table only?

0 Kudos