Dojo FilteringSelect显示为纯文本框

时间:2013-01-20 06:08:08

标签: javascript dojo arcgis-server

我刚开始尝试使用Dojo与ESRI ArcGIS Server一起使用。我已经尝试了一些教程,我遇到了Dojo FilteringSelect Dijit的问题。

我的代码的相关部分:

<script>
  dojo.require("esri.map");
  dojo.require("esri.tasks.query");
  dojo.require("dojo.data.ItemFileReadStore");
  dojo.require("dijit.form.FilteringSelect");

  var map;

  function init() {
    map = new esri.Map("mapDiv",{
      basemap: "streets",
      center: [-80.94, 33.646],
      zoom: 8
    });
    dojo.connect(map, "onLoad", initFunctionality);
  }

  function initFunctionality(map) {
    //build query task
    var queryTask = new esri.tasks.QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/3");

    //build query filter
    var query = new esri.tasks.Query();
    query.returnGeometry = true;
    query.outFields = ["NAME", "POP2000", "POP2007", "POP00_SQMI", "POP07_SQMI"];
    query.where = "STATE_NAME = 'South Carolina'";
    query.outSpatialReference = {"wkid":102100};

    var infoTemplate = new esri.InfoTemplate();
    infoTemplate.setTitle("${NAME}");
    infoTemplate.setContent( "<b>2000 Population: </b>${POP2000}<br/>"
                         + "<b>2000 Population per Sq. Mi.: </b>${POP00_SQMI}<br/>"
                         + "<b>2007 Population: </b>${POP2007}<br/>"
                         + "<b>2007 Population per Sq. Mi.: </b>${POP07_SQMI}");

    map.infoWindow.resize(245,105);

    //Can listen for onComplete event to process results or can use the callback option in the queryTask.execute method.
    dojo.connect(queryTask, "onComplete", function(featureSet) {
      map.graphics.clear();

      var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,255,255,0.35]), 1),new dojo.Color([125,125,125,0.35]));

      //QueryTask returns a featureSet.  Loop through features in the featureSet and add them to the map.
      dojo.forEach(featureSet.features,function(feature){
        var graphic = feature;
        graphic.setSymbol(symbol);
        graphic.setInfoTemplate(infoTemplate);

        map.graphics.add(graphic);
      });
    });

    queryTask.execute(query);
  }

  function initLineID(features) {
    var lineIdObjects = [];
    dojo.forEach(features.features, function(feature) {
        lineIdObjects.push({"name": feature.attributes.field_name});
    });

    //Build the appropriate data object for our data component
    var data = {
          "identifier": "name",
          "items": lineIdObjects
    }

    //bind the data object to the datastore
    var lineDataStore = new dojo.data.ItemFileReadStore({data: data});

    //bind the data store to the FilteringSelect component
    dijit.byId("lineid").store = lineDataStore;
 } 

  dojo.ready(init);
</script>

以及

<input dojoType="dijit.form.FilteringSelect" 
       id="lineid"
       searchAttr="name" 
       name="widgetName" 
       onChange="doSomething(this.value)">

我面临的挑战是结果页面只显示基本

<input type="text"> 

盒。有谁知道这是为什么?感谢。

2 个答案:

答案 0 :(得分:1)

我的猜测是你没有配置主题。您可以通过添加样式表和修改body元素来实现。

在这个例子中,我使用的是claro主题。

<link href="PATH_TO/dojo/resources/dojo.css" rel="stylesheet">
<link href="PATH_TO/dijit/themes/dijit.css" rel="stylesheet">
<link href="PATH_TO/dijit/themes/tundra/tundra.css" rel="stylesheet">

将主题名称添加到body元素。

<body class="tundra">

答案 1 :(得分:0)

parseOnLoad设置为false。为了我将来的参考,我为什么要把它留下来呢?