如何在FeatureTable中所选项目后突出显示调用函数

时间:2016-05-26 16:28:03

标签: javascript javascript-events arcgis-js-api

我有一个由FeatureTable生成的路由表,我使用setSelectionSymbol将表中选择的路由更改为红色。我的问题是我想在地图上的路线更改为红色后确认路线选择,我的代码在路线变为红色之前要求确认。我的代码是

     var map, stateBaseMap, geometryLayer, routeFeature, routeDataFeature, myFeatureTable,
        stateBaseMapUrl, geometryLayerUrl, routeFeatureUrl, routeDataFeatureUrl;

  require([ "esri/map",
            "esri/layers/ArcGISDynamicMapServiceLayer",
            "esri/layers/ArcGISTiledMapServiceLayer",
            "esri/tasks/GeometryService",
            "esri/layers/FeatureLayer",
            "esri/dijit/FeatureTable",
             "esri/symbols/SimpleLineSymbol",
             "esri/Color", 
             "dijit/layout/ContentPane",
              "dijit/layout/BorderContainer",
              "esri/geometry/Extent",
              "esri/graphicsUtils",
              "esri/tasks/query",
              "dojo/dom",
              "dojo/parser",
              "dojo/ready",
              "dojo/on"],
    function(Map,
             ArcGISDynamicMapServiceLayer, 
             ArcGISTiledMapServiceLayer, 
             GeometryService, 
             FeatureLayer,
             FeatureTable,
             SimpleLineSymbol,
             Color,
             ContentPane, 
             BorderContainer,
             Extent, 
             graphicsUtils, 
             Query,
              dom, 
              parser, 
              ready, 
              on) {
      parser.parse();

      ready(function(){
            esri.config.defaults.io.proxyUrl = "/llr/llrproxy";
            esri.config.defaults.io.alwaysUseProxy = false;
            esri.config.defaults.io.corsDetection = false;
            stateBaseMapUrl = document.getElementById("shipment_stateBaseMapServiceURL").value;
            geometryLayerUrl = document.getElementById("shipment_geometryServiceURL").value;
            routeFeatureUrl = document.getElementById("shipment_routeLayerURL").value;
            map = new Map("map");
            stateBaseMap = new ArcGISTiledMapServiceLayer(stateBaseMapUrl);
            map.addLayer(stateBaseMap);
            geometryLayer = new GeometryService(geometryLayerUrl);
            map.addLayer(geometryLayer);

            routeFeature = new FeatureLayer(routeFeatureUrl, {
                mode : FeatureLayer.MODE_ONDEMAND,
                outFields : [ "*" ],
                visible:true,
                id : "routeFeature"
            });
            var selectionSymbol = new  SimpleLineSymbol(
                    SimpleLineSymbol.STYLE_SOLID,
                    new Color([255,0,0]),
                    4
                  );

            routeFeature.setSelectionSymbol(selectionSymbol);

            map.addLayer(routeFeature);
            on(routeFeature, "load", function(){
                loadTable();
                myFeatureTable.on("row-select", function(evt){
                    confirmRoute(evt);
                  });
              });
            function confirmRoute(evt) {
                var message = "Is this the correct route?\nEntry State: "+
                                evt[0].data.ORIGIN  + "\nRoute Description: " +
                                evt[0].data.ROUTE_DESC + "\nExit State: " +
                                evt[0].data.DESTNATION ;
                if (confirm(message) == true) {
                    document.getElementById('shipment_routeText').value = evt[0].data.ROUTE_DESC;
                    var oldAction = document.getElementById("shipment").action;
                    var url = oldAction.replace("shipment","shipment"+"_saveRoute");
                    document.forms[0].action = url;
                    document.forms[0].submit();

                }
            }

            function loadTable(){
                    myFeatureTable = new FeatureTable({
                    featureLayer : routeFeature,
                    map : map, 
                    editable: false,
                    fieldInfos: [
                              {
                                name: 'ROUTE_ID', 
                                visible: false
                              },
                              {
                                name: 'ORIGIN', 
                                alias: 'Entry State'
                              },
                              {
                                name: 'ROUTE_DESC', 
                                alias: 'Route Description'
                              },
                              {
                                name: 'DESTNATION', 
                                alias: 'Exit State'
                              }
                    ]
                  }, 'myTableNode');

                  myFeatureTable.startup();
            }
        });
      });

我想通过将confirmRoute(evt)函数放在myFeatureTable.on("row-select", function(evt){}事件处理程序中,路由将首先突出显示,但事实并非如此。我使用的是3.16版。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

我认为我通过将update-end事件处理程序嵌套到row-select处理程序来解决了这个问题。我也会在确认后删除update-end处理程序。否则,如果我没有点击取消,我会堆叠确认窗口。这是我改变的代码的一部分。

                map.addLayer(routeFeature);
            on(routeFeature, "load", function(){
                loadTable();
                myFeatureTable.on("row-select", function(evt){
                    routeChange = routeFeature.on("update-end", function(none){
                                            confirmRoute(evt);
                                        });
                  });
              });
            function confirmRoute(evt) {
                var message = "Is this the correct route?\nEntry State: "+
                                evt[0].data.ORIGIN  + "\nRoute Description: " +
                                evt[0].data.ROUTE_DESC + "\nExit State: " +
                                evt[0].data.DESTNATION ;
                if (confirm(message) == true) {
                    document.getElementById('shipment_gisRouteId').value = evt[0].data.ROUTE_ID;
                    document.getElementById('shipment_routeText').value = evt[0].data.ROUTE_DESC;
                    var oldAction = document.getElementById("shipment").action;
                    var url = oldAction.replace("shipment","shipment"+"_saveRoute");
                    document.forms[0].action = url;
                    document.forms[0].submit();
                }
                routeChange.remove();
            }