#18185 closed defect (fixed)
dijit/form/Button's _fillContent implementation breaks attach points inside Button content
Reported by: | RoystonS | Owned by: | bill |
---|---|---|---|
Priority: | undecided | Milestone: | 1.11 |
Component: | Dijit - Form | Version: | 1.9.3 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
If I have a templated control whose template looks like this:
<div> <div data-dojo-type="dijit/form/Button"> <div> <h3 data-dojo-attach-point="titleNode"></h3> <span>Something else</span> </div> <span>Something else</span> </div> </div>
(That is, it contains a button that contains some non-trivial content with an attach point inside.)
Then, when I try to access my widget's titleNode
attach point (either directly or through _setXXXAttr mappings), I discover that it's actually pointing to a copy of the node that's actually in the DOM tree.
Normally, _TemplatedMixin._fillContent
is responsible for moving the contained nodes of a templated widget into its containerNode
. But Button
has its own version of _fillContent
that overrides this; instead of moving the actual nodes, it effectively clones them by converting the contained nodes to an innerHTML
string, and then sets its label
property to that HTML:
_fillContent: function(/*DomNode*/ source){ // Overrides _Templated._fillContent(). // If button label is specified as srcNodeRef.innerHTML rather than // this.params.label, handle it here. // TODO: remove the method in 2.0, parser will do it all for me if(source && (!this.params || !("label" in this.params))){ var sourceLabel = lang.trim(source.innerHTML); if(sourceLabel){ this.label = sourceLabel; // _applyAttributes will be called after buildRendering completes to update the DOM } } },
When _WidgetBase
continues and runs its _applyAttributes
, that label
is pushed into _ButtonMixin._setLabelAttr
, which pushes that HTML string into the Button's containerNode, completing the clone of the original nodes, and meaning that the original attach point is now pointing to a different node than the one in the real DOM tree.
Interestingly, simply removing this overridden version of _fillContent
and falling back to the one
Change History (6)
comment:1 Changed 7 years ago by
comment:2 Changed 7 years ago by
Milestone: | tbd → 1.11 |
---|---|
Owner: | set to bill |
Status: | new → assigned |
OK, I will check in a fix for 1.11.
It turns out this change is complicated by the code in DropDownButton?.html that handles when the dropdown is specified as part of the button's content, like:
<div data-dojo-type=dijit/form/DropDownButton> <span>click me</span> <span data-dojo-type=dijit/Menu>...</span> </div>
To make things worse, specifying the label as an attribute also used to work (albeit it wasn't documented):
<div data-dojo-type=dijit/form/DropDownButton label="click me"> <span data-dojo-type=dijit/Menu>...</span> </div>
Anyway, that's why I'm not planning to backport the change, at least for now.
comment:3 Changed 7 years ago by
Resolution: | → fixed |
---|---|
Status: | assigned → closed |
Hmm,
Button#_fillContent()
does seem weird now. OTOH, it triggers a call to_setLabelAttr()
, which then setsthis.titleNode.title
according to the label. Need to keep that part working.