How do I navigate through attributes to populate a form?

[ChrisSergent]

I want to obtain the attribute information of the following:

With the following code I can get the GLOBALID, but I am in need of each attribute. I commented out what I tried to add. It did not work. For now, if you can give me an idea on how to do a second one, I can do the rest. Here is my code:

 on(dom.byId("btnSignPrevious"), "click", function () {
            console.log("Previous Works");
            var query = new esriQuery();
            var queryTask = new QueryTask(config.signLayerUrl);
            query.returnGeometry = false;
            query.outFields = ["*"];






            query.where = "SUPPORTID = " + dom.byId("signSupportId").value;
            queryTask.execute(query, function (results) {
                ii--;
                // Attempting to know how many signs are in my results
                // Use gettArray.html to get array values




                var resultItems = [];
                var resultCount = results.features.length;
                if (ii > -1) {
                    console.log("Results start now!");
                    console.log(results);
                    var featureAttributes = results.features[ii].attributes.GLOBALID;
                    //var attachLoc = results.features[ii].attributes.ATTACHLOC;
                    for (var attr in featureAttributes) {
                        console.log("Attribute: " + featureAttributes);
                        
                    }


                    //for (var attr in attachLoc) {
                    //    console.log("ATTACHLOC:" + featureAttributes);
                    //}


                } else {
                    console.log("This is where you will get the support information");
                    //document.getElementById("btnSupportNext").disabled = true;
                }




            })
        });

And here is the release on github that matches this code: csergent45/streetSigns at db8123a8c67514aefd8739743fe75880e23f31e7 · GitHub

[TimWitt2]

I think what Robert is talking about is how the datagrid here is populated?

ArcGIS API for JavaScript Sandbox

[ChrisSergent]

Here is my code:

// Cycle through sign information with the previous button
        // Changed name to correct button name
        on(dom.byId("btnSignPrevious"), "click", function () {
            console.log("Previous Works");
            var query = new esriQuery();
            var queryTask = new QueryTask(config.signLayerUrl);
            query.returnGeometry = false;
            query.outFields = ["*"];






            query.where = "SUPPORTID = " + dom.byId("signSupportId").value;
            queryTask.execute(query, function (results) {
                ii--;
                // Attempting to know how many signs are in my results
                // Use gettArray.html to get array values




                var resultItems = [];
                var resultCount = results.features.length;
                if (ii > -1) {
                    //console.log("Results start now!");


                    //console.log(results);
                    if (dom.byId("signSupportId").value == results.features[ii].attributes.SUPPORTID) {
                        ii--;
                    }
                   
                    document.getElementById("signObjectId").value = results.features[ii].attributes.GLOBALID;
                    document.getElementById("mutcd").value = results.features[ii].attributes.MUTCD;
                    document.getElementById("installed").value = results.features[ii].attributes.INSTALLED;
                    document.getElementById("signId").value = results.features[ii].attributes.SIGNID;
                    document.getElementById("facing").value = results.features[ii].attributes.FACING;
                    document.getElementById("visibility").value = results.features[ii].attributes.VISIBILITY;
                    document.getElementById("condition").value = results.features[ii].attributes.CONDITION_;






                   




                    //var featureAttributes = results.features[ii].attributes.GLOBALID;
                   
                    //for (var attr in featureAttributes) {
                    //    console.log("Attribute: " + featureAttributes);
                       
                    //}


                    //var attachLoc = results.features[ii].attributes.ATTACHLOC;
                    //for (var attr in featureAttributes) {
                    //    console.log("ATTACHLOC:" + attachLoc);
                    //}


                    //var attachNum = results.features[ii].attributes.ATTACHNUM;
                    //for (var attr in featureAttributes) {
                    //    console.log("AttachNum:" + attachNum);
                    //}


                } else {
                    console.log("This is where you will get the support information");
                    //document.getElementById("btnSupportNext").disabled = true;
                }




            })
        });

and here is an excerpt from my form:

 <div class="modal-body">
                        <div class="form-group">
                            <label for="signObjectId">Object ID</label>
                            <input type="number" class="form-control" name="signObjectId" id="signObjectId" readonly>
                        </div>
                        <!-- Mutcd Begin -->
                        <div class="form-group">
                            <label for="mutcd">MUTCD</label>
                            <select id="mutcd" class="form-control" name="mutcd" required></select>
                        </div>
                        <!-- Mutcd End -->
                        <!-- - Begin -->
                        <div class="form-group">
                            <label for="installed">Installed</label>
                            <input type="date" class="form-control" name="installed" id="installed" />
                        </div>
                        <!-- Installed End -->
                        <!-- Sign ID Begin -->
                        <div class="form-group">
                            <label for="signId">Sign ID</label>
                            <input type="number" class="form-control" placeholder="Sign ID" name="signId" id="signId" />
                        </div>
                        <!-- Sign ID End -->
                        <!-- Facing Begin -->
                        <div class="form-group">
                            <label for="facing">Facing</label>
                            <input type="text" class="form-control" placeholder="Facing" name="facing" id="facing" />
                        </div>
                        <!-- Facing End -->
                        <!-- Visibility Begin -->
                        <div class="form-group">
                            <label for="visibility">Visibility</label>
                            <select id="visibility" class="form-control" name="visibility" required></select>
                        </div>
                        <!-- Visibility End -->
                        <!-- Condition Begin -->
                        <div class="form-group">
                            <label for="condition">Condition</label>
                            <select id="condition" class="form-control" name="condition" required></select>
                        </div>
                        <!-- Condition End -->
                        <!-- Support ID Begin -->
                        <div class="form-group">
                            <label for="signSupportId">Support ID</label>
                            <input type="number" class="form-control" name="signSupportId" id="signSupportId" />
                        </div>
                        <!-- Support ID End -->
                        <!-- Text Begin -->
                        <div class="form-group">
                            <label for="text">Text</label>
                            <input type="text" class="form-control" name="text" id="text" />
                        </div>
                        <!-- Text End -->

[RobertScheitlin__GISP]

Chris,

  So what I am saying is with proper code optimization your from element ids would be the same CaSe and all of your actual field attribute names and that way your line 35 thru 41 being necessary you would only have these lines:

    var featureAttributes = results.features[ii].attributes;
    for (var attr in featureAttributes) {
        document.getElementById(attr).value = featureAttributes[attr];
    }

It would require your html form portion to be altered to have ids that match the attribute name

i.e.

                        <!-- Mutcd Begin -->  
                        <div class="form-group">  
                            <label for="mutcd">MUTCD</label>  
                            <select id="MUTCD" class="form-control" name="mutcd" required></select>  
                        </div>  
                        <!-- Mutcd End -->

Notice the id is the same CaSe as the actual attribute name.

[RobertScheitlin__GISP · Accepted solution]

Chris,

  So your whole optimized back button function would look like this after you update all your form ids:

        on(dom.byId("btnSignPrevious"), "click", function () {
            console.log("Previous Works");
            var query = new esriQuery();
            var queryTask = new QueryTask(config.signLayerUrl);
            query.returnGeometry = false;
            query.outFields = ["*"];
            query.where = "SUPPORTID = " + dom.byId("signSupportId").value;
            queryTask.execute(query, function (results) {
                ii--;
                var resultItems = [];
                var resultCount = results.features.length;
                if (ii > -1) {
                    if (dom.byId("signSupportId").value == results.features[ii].attributes.SUPPORTID) {
                        ii--;
                    }
                    var featureAttributes = results.features[ii].attributes;
                    for (var attr in featureAttributes) {
                        document.getElementById(attr).value = featureAttributes[attr];
                    }
                } else {
                    console.log("This is where you will get the support information");
                }
            })
        });

[ChrisSergent]

So I take it I need to change all of my form ID's to caps to match the attributes. Is that correct, because it's not doing anything right now.

[RobertScheitlin__GISP]

Correct

[ChrisSergent]

Then that gets a little tricky. I have a SUPPORTID in both forms. The reason for this is that there is a support ID for supports and there is a support ID for signs to identify which signs relate to the supports. Any idea on how to get around that?

[RobertScheitlin__GISP]

Chris,

  Sure just use a prefix in front of all your ids for your sign form ids. "SIGN_MUTCD" and then change the inner code of the for loop to:

document.getElementById("SIGN_" + attr).value = featureAttributes[attr];

[ChrisSergent]

That's a tough one. That changes most of my application as I populate dropdowns and textboxes based on the current names. Are you sure this will work, because this is the only part of my application not working right now.

[RobertScheitlin__GISP]

Chris,

   Yes I am sure it will work.