list view custom widget
Create a ListView widget—Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers
has a bug in the code. I think the problem is at step 8 and 9. since layerInfosObj is undefined. and there is a problem in settings. Would you please provide me with the final working code?
Thank you very much.
Yiwei,
I used the zipped folder you provided in your last message and placed the ListView widget inside the stemapp/widget folder. I created a new WAB dev edition locally and tested the widget settings, but it still does not show any field in the thumbnail and title sections. I am using the feature layer mentioned in the tutorial, but it does not populate those two fields still.
Hi,
Thanks for finding out the issues. There are a couple places in the online tutorial that either have errors or missing information, which will be corrected soon.
I uploaded the correct sample code for this widget on GeoNet:
https://community.esri.com/servlet/JiveServlet/download/10442-1-182818/ListView.zip
Hope this still helps.
Yiwei
All,
Here are my fixes commented in the code for this sample:
jsong-esristaff
Settings.js:
<SPAN class="comment token">///////////////////////////////////////////////////////////////////////////</SPAN> <SPAN class="comment token">// Copyright © 2014 - 2016 Esri. All Rights Reserved.</SPAN> <SPAN class="comment token">//</SPAN> <SPAN class="comment token">// Licensed under the Apache License Version 2.0 (the "License");</SPAN> <SPAN class="comment token">// you may not use this file except in compliance with the License.</SPAN> <SPAN class="comment token">// You may obtain a copy of the License at</SPAN> <SPAN class="comment token">//</SPAN> <SPAN class="comment token"><SPAN>// </SPAN><A class="jive-link-external-small" href="https://community.esri.com/external-link.jspa?url=http%3A%2F%2Fwww.apache.org%2Flicenses%2FLICENSE-2.0" target="_blank">http://www.apache.org/licenses/LICENSE-2.0</A></SPAN> <SPAN class="comment token">//</SPAN> <SPAN class="comment token">// Unless required by applicable law or agreed to in writing, software</SPAN> <SPAN class="comment token">// distributed under the License is distributed on an "AS IS" BASIS,</SPAN> <SPAN class="comment token">// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.</SPAN> <SPAN class="comment token">// See the License for the specific language governing permissions and</SPAN> <SPAN class="comment token">// limitations under the License.</SPAN> <SPAN class="comment token">///////////////////////////////////////////////////////////////////////////</SPAN> <SPAN class="token function">define</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN> <SPAN class="string token">'dojo/_base/declare'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'jimu/BaseWidgetSetting'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dojo/_base/lang'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dojo/_base/array'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dijit/_WidgetsInTemplateMixin'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dijit/form/Select'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'jimu/LayerInfos/LayerInfos'</SPAN> <SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>declare<SPAN class="punctuation token">,</SPAN> BaseWidgetSetting<SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">,</SPAN> array<SPAN class="punctuation token">,</SPAN> _WidgetsInTemplateMixin<SPAN class="punctuation token">,</SPAN> Select<SPAN class="punctuation token">,</SPAN> LayerInfos<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//Fix 1 add ', _WidgetsInTemplateMixin' to the declare array</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="token function">declare</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>BaseWidgetSetting<SPAN class="punctuation token">,</SPAN> _WidgetsInTemplateMixin<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="punctuation token">{</SPAN> baseClass<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'jimu-widget-listview-setting'</SPAN><SPAN class="punctuation token">,</SPAN> postCreate<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//the config object is passed in</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">setConfig</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> setConfig<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>config<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">// Update header text</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>headerTextNode<SPAN class="punctuation token">.</SPAN>value <SPAN class="operator token">=</SPAN> config<SPAN class="punctuation token">.</SPAN>widgetHeaderText<SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// Get all feature layers from the map</SPAN> <SPAN class="keyword token">var</SPAN> layerInfosObj <SPAN class="operator token">=</SPAN> LayerInfos<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getInstanceSync</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> infos <SPAN class="operator token">=</SPAN> layerInfosObj<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getLayerInfoArray</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> options <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN> array<SPAN class="punctuation token">.</SPAN><SPAN class="token function">forEach</SPAN><SPAN class="punctuation token">(</SPAN>infos<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>info<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>info<SPAN class="punctuation token">.</SPAN>originOperLayer<SPAN class="punctuation token">.</SPAN>layerType <SPAN class="operator token">===</SPAN> <SPAN class="string token">'ArcGISFeatureLayer'</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> options<SPAN class="punctuation token">.</SPAN><SPAN class="token function">push</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN> label<SPAN class="punctuation token">:</SPAN> info<SPAN class="punctuation token">.</SPAN>title<SPAN class="punctuation token">,</SPAN> value<SPAN class="punctuation token">:</SPAN> info<SPAN class="punctuation token">.</SPAN>id <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>layerSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'options'</SPAN><SPAN class="punctuation token">,</SPAN> options<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">//Fix 2</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>config<SPAN class="punctuation token">.</SPAN>layerId<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>layerSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">,</SPAN> config<SPAN class="punctuation token">.</SPAN>layerId<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="comment token">//End Fix 2</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>layerSelect<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'change'</SPAN><SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>value<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> selectedLayer <SPAN class="operator token">=</SPAN> layerInfosObj<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getLayerInfoById</SPAN><SPAN class="punctuation token">(</SPAN>value<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>selectedLayer<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> fieldOptions <SPAN class="operator token">=</SPAN> array<SPAN class="punctuation token">.</SPAN><SPAN class="token function">map</SPAN><SPAN class="punctuation token">(</SPAN>selectedLayer<SPAN class="punctuation token">.</SPAN>layerObject<SPAN class="punctuation token">.</SPAN>fields<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>field<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="punctuation token">{</SPAN> label<SPAN class="punctuation token">:</SPAN> field<SPAN class="punctuation token">.</SPAN>alias <SPAN class="operator token">||</SPAN> field<SPAN class="punctuation token">.</SPAN>name<SPAN class="punctuation token">,</SPAN> value<SPAN class="punctuation token">:</SPAN> field<SPAN class="punctuation token">.</SPAN>name <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>thumbnailSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'options'</SPAN><SPAN class="punctuation token">,</SPAN> fieldOptions<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>titleSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'options'</SPAN><SPAN class="punctuation token">,</SPAN> fieldOptions<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">//Fix 3</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>config<SPAN class="punctuation token">.</SPAN>thumbnailField<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>thumbnailSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">,</SPAN> config<SPAN class="punctuation token">.</SPAN>thumbnailField<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>config<SPAN class="punctuation token">.</SPAN>titleField<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>titleSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">set</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">,</SPAN> config<SPAN class="punctuation token">.</SPAN>titleField<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="comment token">//End Fix 3</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> getConfig<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//WAB will get config object through this method</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//Fix 4</SPAN> widgetHeaderText<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>headerTextNode<SPAN class="punctuation token">.</SPAN>value<SPAN class="punctuation token">,</SPAN> <SPAN class="comment token">//End Fix 4</SPAN> layerId<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>layerSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">get</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> thumbnailField<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>thumbnailSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">get</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> titleField<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>titleSelect<SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">get</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'value'</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
Widget.js:
<SPAN class="token function">define</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN><SPAN class="string token">'dojo/_base/declare'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'jimu/BaseWidget'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dojo/_base/lang'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dojo/Deferred'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dgrid/OnDemandList'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'dgrid/Selection'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"dojo/store/Memory"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"esri/tasks/query"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"esri/symbols/SimpleMarkerSymbol"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"esri/symbols/SimpleLineSymbol"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"esri/symbols/SimpleFillSymbol"</SPAN> <SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>declare<SPAN class="punctuation token">,</SPAN> BaseWidget<SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">,</SPAN> Deferred<SPAN class="punctuation token">,</SPAN> OnDemandList<SPAN class="punctuation token">,</SPAN> Selection<SPAN class="punctuation token">,</SPAN> Memory<SPAN class="punctuation token">,</SPAN> Query<SPAN class="punctuation token">,</SPAN> SimpleMarkerSymbol<SPAN class="punctuation token">,</SPAN> SimpleLineSymbol<SPAN class="punctuation token">,</SPAN> SimpleFillSymbol<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//To create a widget, you need to derive from BaseWidget.</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="token function">declare</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>BaseWidget<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="punctuation token">{</SPAN> baseClass<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'jimu-widget-listview'</SPAN><SPAN class="punctuation token">,</SPAN> postCreate<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">inherited</SPAN><SPAN class="punctuation token">(</SPAN>arguments<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>headerNode<SPAN class="punctuation token">.</SPAN>innerHTML <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">.</SPAN>widgetHeaderText<SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>featureLayer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">.</SPAN>layerId<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> highlightSymbol<SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">switch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>featureLayer<SPAN class="punctuation token">.</SPAN>geometryType<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">case</SPAN> <SPAN class="string token">'esriGeometryPoint'</SPAN><SPAN class="punctuation token">:</SPAN> highlightSymbol <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleMarkerSymbol</SPAN><SPAN class="punctuation token">(</SPAN>SimpleMarkerSymbol<SPAN class="punctuation token">.</SPAN>STYLE_CIRCLE<SPAN class="punctuation token">,</SPAN> <SPAN class="number token">20</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">null</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'#e74c3c'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">break</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">case</SPAN> <SPAN class="string token">'esriGeometryPolyline'</SPAN><SPAN class="punctuation token">:</SPAN> highlightSymbol <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleLineSymbol</SPAN><SPAN class="punctuation token">(</SPAN>SimpleLineSymbol<SPAN class="punctuation token">.</SPAN>STYLE_SOLID<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'#e74c3c'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">3</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">break</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">case</SPAN> <SPAN class="string token">'esriGeometryPolygon'</SPAN><SPAN class="punctuation token">:</SPAN> highlightSymbol <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleFillSymbol</SPAN><SPAN class="punctuation token">(</SPAN>SimpleFillSymbol<SPAN class="punctuation token">.</SPAN>STYLE_SOLID<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">SimpleLineSymbol</SPAN><SPAN class="punctuation token">(</SPAN>SimpleLineSymbol<SPAN class="punctuation token">.</SPAN>STYLE_SOLID<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'#fff'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">2</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'#e74c3c'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">break</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>featureLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setSelectionSymbol</SPAN><SPAN class="punctuation token">(</SPAN>highlightSymbol<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">createList</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> getDataStore<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> def <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Deferred</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> layer <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">.</SPAN>layerId<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// Query features</SPAN> <SPAN class="keyword token">var</SPAN> query <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Query</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> query<SPAN class="punctuation token">.</SPAN>returnGeometry <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN> query<SPAN class="punctuation token">.</SPAN>outFields <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="string token">"*"</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN> query<SPAN class="punctuation token">.</SPAN>where <SPAN class="operator token">=</SPAN> <SPAN class="string token">'1=1'</SPAN><SPAN class="punctuation token">;</SPAN> layer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">queryFeatures</SPAN><SPAN class="punctuation token">(</SPAN>query<SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>featureSet<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> featureSetRemapped <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">for</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">var</SPAN> index <SPAN class="keyword token">in</SPAN> featureSet<SPAN class="punctuation token">.</SPAN>features<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> feature <SPAN class="operator token">=</SPAN> featureSet<SPAN class="punctuation token">.</SPAN>features<SPAN class="punctuation token">[</SPAN>index<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN> featureSetRemapped<SPAN class="punctuation token">.</SPAN><SPAN class="token function">push</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="string token">'id'</SPAN><SPAN class="punctuation token">:</SPAN> feature<SPAN class="punctuation token">.</SPAN>attributes<SPAN class="punctuation token">[</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>featureLayer<SPAN class="punctuation token">.</SPAN>objectIdField<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'title'</SPAN><SPAN class="punctuation token">:</SPAN> feature<SPAN class="punctuation token">.</SPAN>attributes<SPAN class="punctuation token">[</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">.</SPAN>titleField<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'thumbnailImg'</SPAN><SPAN class="punctuation token">:</SPAN> feature<SPAN class="punctuation token">.</SPAN>attributes<SPAN class="punctuation token">[</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>config<SPAN class="punctuation token">.</SPAN>thumbnailField<SPAN class="punctuation token">]</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> def<SPAN class="punctuation token">.</SPAN><SPAN class="token function">resolve</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Memory</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN> data<SPAN class="punctuation token">:</SPAN> featureSetRemapped <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">return</SPAN> def<SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> createList<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">getDataStore</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN>lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>datastore<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> list <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="token function">declare</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>OnDemandList<SPAN class="punctuation token">,</SPAN> Selection<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN> <SPAN class="string token">'store'</SPAN><SPAN class="punctuation token">:</SPAN> datastore<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'selectionMode'</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'single'</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'renderRow'</SPAN><SPAN class="punctuation token">:</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>object<SPAN class="punctuation token">,</SPAN> options<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_createListItem</SPAN><SPAN class="punctuation token">(</SPAN>object<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>ListNode<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> list<SPAN class="punctuation token">.</SPAN><SPAN class="token function">startup</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> list<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'.dgrid-row:click'</SPAN><SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>evt<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> row <SPAN class="operator token">=</SPAN> list<SPAN class="punctuation token">.</SPAN><SPAN class="token function">row</SPAN><SPAN class="punctuation token">(</SPAN>evt<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">var</SPAN> query <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Query</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> query<SPAN class="punctuation token">.</SPAN>objectIds <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>row<SPAN class="punctuation token">.</SPAN>data<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">//Fix 1 </SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>featureLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">selectFeatures</SPAN><SPAN class="punctuation token">(</SPAN>query<SPAN class="punctuation token">,</SPAN> esri<SPAN class="punctuation token">.</SPAN>layers<SPAN class="punctuation token">.</SPAN>FeatureLayer<SPAN class="punctuation token">.</SPAN>SELECTION_NEW<SPAN class="punctuation token">,</SPAN> lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>result<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">//End Fix 1</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>result<SPAN class="punctuation token">.</SPAN>length<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> feature <SPAN class="operator token">=</SPAN> result<SPAN class="punctuation token">[</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">,</SPAN> newMapCenter<SPAN class="punctuation token">,</SPAN> geometry <SPAN class="operator token">=</SPAN> feature<SPAN class="punctuation token">.</SPAN>geometry<SPAN class="punctuation token">,</SPAN> extent <SPAN class="operator token">=</SPAN> geometry<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getExtent</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> shape <SPAN class="operator token">=</SPAN> feature<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getShape</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>extent <SPAN class="operator token">&&</SPAN> extent<SPAN class="punctuation token">.</SPAN>getCenter<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> newMapCenter <SPAN class="operator token">=</SPAN> extent<SPAN class="punctuation token">.</SPAN><SPAN class="token function">getCenter</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// polygon & polyline</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">else</SPAN> <SPAN class="punctuation token">{</SPAN> newMapCenter <SPAN class="operator token">=</SPAN> geometry<SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// point</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">centerAt</SPAN><SPAN class="punctuation token">(</SPAN>newMapCenter<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// move to the feature</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>shape<SPAN class="punctuation token">)</SPAN> shape<SPAN class="punctuation token">.</SPAN><SPAN class="token function">moveToFront</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// move the feature to front</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> _createListItem<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>featureObj<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> listItemRoot <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">createElement</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'DIV'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> listItemRoot<SPAN class="punctuation token">.</SPAN>className <SPAN class="operator token">=</SPAN> <SPAN class="string token">'list-item'</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>featureObj<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">var</SPAN> thumbnailImgWrapper<SPAN class="punctuation token">,</SPAN> thumbnailImg<SPAN class="punctuation token">,</SPAN> listItemTitle<SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// Create thumbnail</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>featureObj<SPAN class="punctuation token">.</SPAN>thumbnailImg<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> thumbnailImgWrapper <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">createElement</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'div'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> thumbnailImgWrapper<SPAN class="punctuation token">.</SPAN>className <SPAN class="operator token">=</SPAN> <SPAN class="string token">'thumbnail-wrapper'</SPAN><SPAN class="punctuation token">;</SPAN> thumbnailImg <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">createElement</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'img'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> thumbnailImg<SPAN class="punctuation token">.</SPAN>src <SPAN class="operator token">=</SPAN> featureObj<SPAN class="punctuation token">.</SPAN>thumbnailImg<SPAN class="punctuation token">;</SPAN> thumbnailImgWrapper<SPAN class="punctuation token">.</SPAN><SPAN class="token function">appendChild</SPAN><SPAN class="punctuation token">(</SPAN>thumbnailImg<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> listItemRoot<SPAN class="punctuation token">.</SPAN><SPAN class="token function">appendChild</SPAN><SPAN class="punctuation token">(</SPAN>thumbnailImgWrapper<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="comment token">// Create title</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>featureObj<SPAN class="punctuation token">.</SPAN>title <SPAN class="operator token">&&</SPAN> <SPAN class="keyword token">typeof</SPAN> featureObj<SPAN class="punctuation token">.</SPAN>title <SPAN class="operator token">===</SPAN> <SPAN class="string token">'string'</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> listItemTitle <SPAN class="operator token">=</SPAN> document<SPAN class="punctuation token">.</SPAN><SPAN class="token function">createElement</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'H4'</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> listItemTitle<SPAN class="punctuation token">.</SPAN>innerHTML <SPAN class="operator token">=</SPAN> featureObj<SPAN class="punctuation token">.</SPAN>title<SPAN class="punctuation token">;</SPAN> listItemRoot<SPAN class="punctuation token">.</SPAN><SPAN class="token function">appendChild</SPAN><SPAN class="punctuation token">(</SPAN>listItemTitle<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="keyword token">if</SPAN><SPAN class="punctuation token">(</SPAN>thumbnailImg<SPAN class="punctuation token">)</SPAN> thumbnailImg<SPAN class="punctuation token">.</SPAN>alt <SPAN class="operator token">=</SPAN> featureObj<SPAN class="punctuation token">.</SPAN>title<SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">else</SPAN> <SPAN class="punctuation token">{</SPAN> listItemRoot<SPAN class="punctuation token">.</SPAN>innerHTML <SPAN class="operator token">=</SPAN> <SPAN class="string token">'NO DATA AVAILABLE'</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">return</SPAN> listItemRoot<SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
I have yet to be able to get their sample code to work.
I copied as the instruction:
define([ 'dojo/_base/declare',
'jimu/BaseWidgetSetting',
'dojo/_base/lang',
'dojo/_base/array',
'dijit/_WidgetsInTemplateMixin',
'dijit/form/Select',
'jimu/LayerInfos/LayerInfos' ],
function(declare, BaseWidgetSetting, lang, array, _WidgetsInTemplateMixin, Select, LayerInfos) {
but I get an error mentioning layerInfosObj is undefined.
What is the list of modules in the define and the list of arguments in the function from step 6? Do their orders match?
The abc’s of AMD | ArcGIS Blog
Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.
