0

I am trying to display coded names (TREE_SPECIES) in the grid, instead of values using ArcGIS JavaScript.

It says updateFeature is undefined. Below is my entire code, which I tried.

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
        <title>BGSU Memorial Tree Listing</title>
        <script src="lib/jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="lib/jquery.highlight-4.js"></script>  
        <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
        <style>           
            html, body {
                height: 100%;
                width: 100%;
                margin: 0;
                padding: 0;
            }
           h3 {
                color:#f89b35;
                text-align:center;
            }
            h4 {
                color:#4f2c1d;
                text-align:center;    
            }           
            #grid {
                height: 100%;
                width: 100%;
            }          
            .field-OBJECTID {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }          
            .field-MEMORIAL {
                width: 20px;
                font-size: .80em;
                font-weight: normal;
            }    
            .field-DONOR {
                width: 20px;
                font-size: .80em;
                font-weight: normal;
            }                   
           .field-MEMNUM {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }                      
            .field-PLINK {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }          
            .field-TLINK {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }            
            .field-TREE_SPECIES {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }      
            .field-TREE_VARIETY {
                width: 10px;
                font-size: .80em;
                font-weight: normal;
            }

            #grid .dgrid-row-odd {
                background: #F2F5F9;
            }

          .highlight {
                background-color: yellow; }

        </style>

<script src="http://js.arcgis.com/3.10/"> </script>
<script>           
            var grid;
            var i;
        var updateFeature;
            require([            // required modules
             "esri/layers/FeatureLayer",
             "dgrid/Grid", 
             "dojo/store/Memory", 
             "dojo/_base/array", 
             "esri/map",
             "esri/tasks/query", 
             "esri/tasks/QueryTask", 
             "dojo/_base/declare", 
             "dojo/on", 
             "dojo/number",
             "dojo/dom", 
             "dojo/dom-style",
             "dojo/ready"
             ], 
            function(
            FeatureLayer,
            Grid,
            Memory,
            array, 
            map,
            Query, 
            QueryTask, 
            declare,
            on, 
            number, 
            dom, 
            domStyle,
            TREE_VARIETY,
            MEMORIAL_TREE_DONOR,
            ready
            ){
                var form = dom.byId("text"),
        //create the grid
                 grid = new Grid({
            bufferRows: Infinity, // all the data is available in the grid
                    columns: { //defines the cloumns 
                        OBJECTID: "OBJECTID",
                        MEMORIAL: "MEMORIAL",
                        DONOR: "DONOR",
                        MEMNUM: "MEMNUM",
                        TREE_SPECIES: "SPECIES",
                        TREE_VARIETY: "VARIETY",
                        TLINK: {
                            label: "TLINK",
                            formatter: makeLink1
                        },
                        PLINK: {
                            label: "PLINK",
                            formatter: makeLink2
                        } 
                    },

               },"grid");

                // create feature layer
                var layer = new FeatureLayer("https://gistest2.bgsu.edu/arcgis/rest/services/MemorialTrees/MemorialTEST/MapServer/0", {
                outFields: ["*"]

                });

                layer.on("load", function(){
                 var query = new Query();
                 query.where = "1=1";
                 query.outFields = ["*"];
                /*  for (var i = 0; i < layer.fields.length; i++) {
                     console.debug(layer.fields[i].domain);
                     var updateFeature = layer.fields[i].domain;
                     }  */
                layer.queryFeatures(query, function(featureSet){
                 // executes on success
                console.log("query featureSet", featureSet);
        if (featureSet.length>0)
            var updateFeature = featureSet[0].getlayer().name();
                populateTable(featureSet);      
                    }, function(error){
                console.log("query error", error);     
                    });                    
                });


                function populateTable(featureSet){ 
                    var data = array.map(featureSet.features, function(feature){
                        return {
                            "OBJECTID": feature.attributes.OBJECTID,
                            "MEMORIAL": feature.attributes.MEMORIAL,
                            "DONOR": feature.attributes.MEMORIAL_TREE_DONOR,
                            "MEMNUM": feature.attributes.MEMNUM,
                            "PLINK": feature.attributes.PLINK,
                            "TLINK": feature.attributes.TLINK,
                "TREE_SPECIES":updateFeature.atrributes.TREE_SPECIES,
                            "TREE_VARIETY": feature.attributes.TREE_VARIETY
                        };

                    });
                    grid.renderArray(data);
             }         

                    function makeLink1(url){
                     console.log("make link", url);
                     return '<a href="Photo.html?value= '+url+'&DONOR='+DONOR+'&TreeVariety='+TreeVariety+'">' +'Photo'+ '</a>';
                } 
                    function makeLink2(url){
                    console.log("make link", url);
                    return '<a href="Map.html?value='+url+' ">' +'Plaque'+ '</a>';
                }
            });
        </script>
        </head>

    <body>

        <h3 align="absmiddle" >  BGSU Memorial Tree Locations </h3>
        <h4 align="center" > <i>Listings | <a target="_self" href="locations.html">Locations</a></i> </h4>    
        <br>
        <div align="center">
    <form>
        <h4>Enter a name, matching result will be highlighted: <input type="text" id="text" /> 
        <a href="#" onclick="javascript:void($('body').removeHighlight().highlight(document.getElementById('text').value));  return false;"> Search</a> </h4>
        </form>
        </div>
        <br>
        <div id="grid">
        </div>
   </body>
   </html>
1

Layer doesn't have a method called name, but it does have a property called name, so replace this line

var updateFeature = featureSet[0].getlayer().name();

with

var updateFeature = featureSet[0].getlayer().name;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.