AnsweredAssumed Answered

My custom widget doesn't turn a select into a dijit, what did I miss?

Question asked by jenkins on Nov 19, 2014
Latest reply on Jun 4, 2015 by rscheitlin

I am trying to make my first custom widget for the WAB 3 (developer's edition).  I started with the CustomWidgetTemplate, moved it to the appropriate folder and I can now see it in my app.  It is a simple in panel widget with some text.   So far so good.  Next I want to add a Select dijit and populate it with a list of city names.  I examined the DRAW widget because it uses some select dijits.  I followed the HTMl and JavaScript patterns from the DRAW widget to add my Select dijit, but when I run the widget in the app, it shows as a regular HTML select and I can't treat it like a dijit.  I think I have all the necessary Dojo requires.  What am I missing?

 

 

My widget's HTML

<div data-dojo-attach-point="selectCity" style="display:block;height:30px;margin-bottom:7px;">

<div style="float:left;height:30px;;line-height:30px;padding-left:17px;">Select City</div>

<select data-dojo-attach-point="citySelect" data-dojo-type="dijit/form/Select" style="float:right;width:50%;height:30px;"></select>

</div>

 

My JavaScript.  In this code, I get an error if I uncomment the 'citySelect.addOption' line because it says this.citySelect is undefined.   If I access this.citySelect from the console, it shows as an HTML select, not a dijit.

widgetcode.png

Outcomes