I have a custom widget settings file that is calling dijit.registry.byId on a textbox that I know exists, but the function is returning undefined. This is occurring in the settings startup function and only began failing when I migrated from WAB2.7 to 2.8.
Snippet
startup: function () {
console.log('startUp');
this.inherited(arguments);
parser.parse();
var textNode = registry.byId("maxZoomTextBox");
if (textNode)
textNode.set('value', this.config.maxZoom);
},
<div>
<label>${nls.maxZoomTextBoxLabel}</label>
<input id="maxZoomTextBox" data-dojo-type="dijit/form/TextBox" type="text" style="width:40px;"/>
<br />
<br />
<label>${nls.featurelayerTextBoxLabel}</label>
<br />
<div class="jimu-widget-clusterer-setting-layers-container" data-dojo-attach-point="layersContainer" id="layersContainerDiv">
</div>
<div class="jimu-btn add-featurelayer" data-dojo-attach-point="addFeaturelayer" data-dojo-attach-event="onclick:_onBtnAddFeaturelayerClicked">Add feature layer</div>
</div>
textNode always = undefined
Can anyone see what I'm doing wrong?
Solved! Go to Solution.
Andrew
registry.byId(this.maxZoomTextBox.id) Is not the way to do it. All you need in your code is this.maxZoomTextBox ( assuming that is what you put for the data-dojo-attach-point) to get widget reference.
Hi!
You can try this ('dojo/dom' must be imported):
dom.byId does not return a dijit, it returns a dom node.
Andrew,
You should be using data-dojo-attach-point on all your controls. That way you can get access to them using this.blahblah
Hi Robert, I'm now doing that, but registry.byId is still returning undefined when I go registry.byId(this.maxZoomTextBox.id)
Andrew
registry.byId(this.maxZoomTextBox.id) Is not the way to do it. All you need in your code is this.maxZoomTextBox ( assuming that is what you put for the data-dojo-attach-point) to get widget reference.
I've ended up creating the TextBox programmatically instead of declaratively, as the declarative code was not creating a dijit in the DOM. I don't know why. Here's the code that works.
var maxZoomTextBox = new TextBox({
class: 'clusterer-maxzoom-textbox',
style: 'width: 40px; margin-top: 5px; margin-bottom: 5px;',
id: 'maxZoomTextbox'
});
maxZoomTextBox.set('value', this.config.maxZoom);
maxZoomTextBox.placeAt('maxZoomTextBoxDiv');
<div> <label>${nls.maxZoomTextBoxLabel}</label> <div data-dojo-attach-point="maxZoomTextBox" data-dojo-props='style:{width:"40px"}' id="maxZoomTextBoxDiv"></div> <br /> <br /> <label>${nls.featurelayerTextBoxLabel}</label> <br /> <div class="jimu-widget-clusterer-setting-layers-container" data-dojo-attach-point="layersContainer" id="layersContainerDiv"> </div> <div class="jimu-btn add-featurelayer" data-dojo-attach-point="addFeaturelayer" data-dojo-attach-event="onclick:_onBtnAddFeaturelayerClicked">Add feature layer</div> </div>
Did you include dijit/form/TextBox in your settings.js and do you have widgetsInTemplateMixin in your define and declare?
I already had dijit/form/TextBox, and just now added widgetsInTemplateMixin, but it made no difference.
Andrew so you added dijit._WidgetsInTemplateMixin to the define array list and also the declare _WidgetsInTemplateMixin to the declare array (that is the step most developers forget)