An issue about featureLayer1.queryFeatures containing featureLayer2.queryFeatures

SailiTang1

Hi,

I am using ArcGIS JSAPI 4.20 to develop a web application. There is one function that is exporting an attribute table as HTML (Please see the screenshot below.) Attributes “Polling Division”, “Elector Count” and “Assign To” are from one Feature layer; the rest attributes including “Assign To” are belonging to the other feature layer, which means that these 2 feature layers can use the same attribute “Assign To” to join together (but I didn’t join them together). A value of “Assign To” is the index number of a location.

You can see that all the values from feature layer 2 are “undefined”. I know why but I don’t know how to fix it. I understand that it should finish running all code outside of query because of the promise of QueryFeatures, but I need VLLayer.queryFeatures to run first and return the values from Feature layer 2 (VLLayer) to build the html table. What’s the way we usually use to realize this purpose? Thanks for your help.

This is my jquery code:

$("#btnExportTable").click(function () {
                //**********************************************

                var htmlToPrint = '' +
                    '<style type="text/css">' +
                    'table { ' +
                    'font-family: arial, sans-serif;' +
                    'border-collapse: collapse;' +
                    'background-color: #f0f9fc;' +
                    'width: 80%;' +
                    'margin-left:auto;' +
                    'margin-right:auto;' +
                    ' } ' +
                    'td {' +
                    'border:1px;' +
                    'text-align: center;' +
                    'padding: 5px;' +
                    'font-size: 12px;' +
                    ' } ' +
                    'tr:nth-child(even) {' +
                    'background-color: #92c8da;' +
                    ' } ' +
                    'tr {' +
                    'page-break-inside: avoid;' +
                    ' } ' +
                    'th {' +
                    'font-size: 13px;' +
                    'font-weight: bold;' +
                    ' } ' +
                    '</style>' +
                    '<h1 style="font-weight:bold;font-size:medium; text-align:center">Voting Location Assignment</h1>' +
                    '<p style="font-weight:bold;font-size:medium; text-align:center">Electoral District of ' + edName + '</p>';

                var header = "<table><tr><th>Polling Division</th><th>Elector Count</th><th>Assign To</th>" +
                    "<th>Building Name</th><th>Landlord Name</th><th>Landlord Phone</th>" +
                    "<th>Landlord Email</th><th>Manager Name</th><th>Manager Phone</th><th>Manager Email</th>" +
                    "</tr > ";
                var end = "</table>";
                htmlToPrint += header;

                var assignTo=[], buildingName = [], landlordName = [], landlordPhone = [], landlordEmail = [], managerName = [], managerPhone = [], managerEmail = [];


                let PDQuery = PDLayer.createQuery();
                PDQuery.where = "ED_NO= '" + edNO + "'";
                PDQuery.orderByFields = ["PD_NO ASC"];
                PDLayer.queryFeatures(PDQuery).then(function (result) {

                    for (let i = 0; i < result.features.length; i++) {
                        
                        if (result.features[i].attributes["VLIndex"] != null) {

                            let vlQuery = VLLayer.createQuery();
                            vlQuery.returnGeometry = false;
                            vlQuery.where = "VLIndexNum='" + result.features[i].attributes["VLIndex"] + "'";
                            VLLayer.queryFeatures(vlQuery).then(function (VLresult) {
                                
                                if (VLresult.features.length != 0) {

                                    assignTo[i] = VLresult.features[0].attributes["VLIndex"];
                                    buildingName[i] =VLresult.features[0].attributes["BUILDING_NAME"];
                                    landlordName[i] =VLresult.features[0].attributes["LANDLORDNAME"];
                                    landlordPhone[i] =VLresult.features[0].attributes["LANDLORDPHONE1"];
                                    landlordEmail[i] =VLresult.features[0].attributes["LANDLORDEMAIL"];
                                    managerName[i] =VLresult.features[0].attributes["MANAGERNAME"];
                                    managerPhone[i] =VLresult.features[0].attributes["MANAGERPHONE1"];
                                    managerEmail[i] =VLresult.features[0].attributes["MANAGEREMAIL"];

                                    
                                }

                            });

                        }
                        

                        htmlToPrint += "<tr><td>" + result.features[i].attributes["PD_NO"] + "</td>" +
                            "<td>" + result.features[i].attributes["electorcount"] + "</td>" +
                            "<td>" + assignTo[i] + "</td>" +
                            "<td>" + buildingName[i] + "</td>" +
                            "<td>" + landlordName[i] + "</td>" +
                            "<td>" + landlordPhone[i] + "</td>" +
                            "<td>" + landlordEmail[i] + "</td>" +
                            "<td>" + managerName[i] + "</td>" +
                            "<td>" + managerPhone[i] + "</td>" +
                            "<td>" + managerEmail[i] + "</td>" +
                            "</tr>";

                    };

                    htmlToPrint = htmlToPrint + end;

                    var newWin = window.open("");
                    newWin.document.write(htmlToPrint);
                    newWin.print();

                });

            });

Thanks,

Saili

SailiTang1

Thank you so much for your reply. I read the article about chaining promises already, but mine is that VLLayer.queryFeatures() is inside of PDLayer.queryFeatures(), and also the result of PDLayer.queryFeatures() is used as query "where" condition of VLLayer.queryFeatures(). Do you think if chaining promise is going to work for this situation? Thanks for your help!

Saili