Hi
i have some records of related table.I want to add click event on row that when clicked on table row map should go to feature location. Please consider the following snippet of code in which click event is working only for first click if i click second time to same row or any other row it does not working.
Robert Scheitlin, GISP Egge-Jan PolléKelly Hutchins
Response from related record
array of relatedRecordGroups
let fatdiv = document.getElementById('fat')
fatdiv.addEventListener('click', () =>{
queryRelated({
url: "https://172.16.6.159:6443/arcgis/rest/services/KarachiSDE/FeatureServer/1",
objectIds: _this.state.id,
relationshipId: 1,
returnGeometry: true,
outFields: ["Name", "FAT", "DC", "POP"]
/* params: { returnCountOnly: true } */
})
.then(response => {
console.log(response)
myTableDiv.innerHTML = ''
var table = document.createElement('TABLE');
table.setAttribute('id', 'table')
//table.appendChild(close)
var thead = document.createElement('thead')
table.appendChild(thead)
var header = document.createElement("tr");
header.setAttribute('id', 'header-tr')
thead.appendChild(header)
var tbody = document.createElement('tbody')
table.appendChild(tbody)
if (response.fields) {
response.fields.forEach(j => {
var column = document.createElement("th");
column.setAttribute('id', 'table-header')
column.textContent = j.alias;
header.appendChild(column);
// console.log(j)
})
}
else {
return null
}
response.relatedRecordGroups.forEach(e => {
e.relatedRecords.forEach(i => {
console.log(i)
var row = document.createElement("tr");
tbody.appendChild(row);
response.fields.forEach(k => {
//console.log(response.fields)
var columns = document.createElement("td");
columns.textContent = i.attributes[k.name];
row.appendChild(columns);
columns.addEventListener('click', () => {
//console.log(i.geometry)
view.goTo({
target: [i.geometry],
zoom: 18
})
})
})
/* console.log(i.attributes.Name)
console.log(i.attributes.FAT)
console.log(i.attributes.DC)
console.log(i.attributes.POP) */
})
}) //console.log(response.relatedRecordGroups)
myTableDiv.appendChild(table);
//view.ui.add(expand, 'top-left')
})
})