Click table row and map goes to feature location

202
0
08-28-2019 10:35 PM
kawishabbas
New Contributor III

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')



                                })
                        })
Tags (1)
0 Kudos
0 Replies