Geek Answers Handbook

Difference between dojoAttachpoint and id

<div dojoType="dojo.Dialog" id="alarmCatDialog" bgColor="#FFFFFF" bgOpacity="0.4" toggle="standard"> <div class='dijitInline'> <input type='input' class='dateWidgetInput' dojoAttachPoint='numberOfDateNode' selected="true"> </div>

how to show this dialog I tried dijit.byId('alarmCatDialog').show();

The above code is a template, and I called dijit.byId('alarmCatDialog').show() from a .js file.

dojo.attr(this.numberOfDateNode) this code works and I got the data. but if I change dojoattachpoint to id, then I try dijit.byId('numberOfDateNode') will not work;

+4
source share
2 answers

Your NumberOfDateNode is a simple DOM node, not a widget / digit, i.e. a javascript object extending dijit/_Widget , because of which you cannot get a link to it through dijit.byId("numberOfDateNode") . Use dojo.byId("numberOfDateNode") , and you're all set up.

dojoAttachPoint or its HTML5 valid version of data-dojo-attach-point used inside the Dijit template to attach a link to a DOM node or a child Dijit to a Dijit JavaScript Object, which is the cause of dijit.byId('alarmCatDialog').numberOfDateNode is a link to your <input type='input' class='dateWidgetInput' .../> .

The main reason for using data-dojo-attach-point is that:

  • you can create several instances of dijit, and therefore your template will not be able to identify nodes / digits by identifiers, since you will have several nodes / digits with the same identifier
  • This is an elegant declarative way, so your code will not be populated with dijit.byId/dojo.byId .
+9
source

It is important to keep track of what the content is and which is the dijit.Dialog template. After you set the contents of the dialog box, its layout is analyzed, but not in a manner, so that TemplatedMixin is applied to widgets declared by default.

To successfully implement the template, you need something similar to the following code, note that I commented on where attachPoints are written.

This SitePen Blog Provides Pleasant Information On This

 define( [ "dojo/declare", "dojo/_base/lang", "dijit/_Templated", "dijit/_Widget", "dijit/Dialog" ], function( declare, lang, _Templated, _Widget, Dialog ) { return declare("my.Dialog", [Dialog, _Templated], { // set any widget (Dialog construct) default parameters here toggle: 'standard', // render the dijit over a specific template // you should be aware, that once this templateString is overloaded, // then the one within Dialog is not rendered templateString: '<div bgColor="#FFFFFF" bgOpacity="0.4">' +// our domNode reference '<div class="dijitInline">' + // setting a dojoAttachPoint makes it referencable from within widget by this attribute value ' <input type="input" class="dateWidgetInput" dojoAttachPoint="numberOfDateNode" selected="true">' + '</div>' + '</div>', constructor: function(args, srcNodeRef) { args = args || {} // assert, we must mixin minimum an empty object lang.mixin(this, args); }, postCreate: function() { // with most overrides, preferred way is to call super functionality first this.inherited(arguments); // here we can manipulate the contents of our widget, // template parser _has run from this point forward var input = this.numberOfDateNode; // say we want to perform something on the numberOfDateNode, do so }, // say we want to use dojo.Stateful pattern such that a call like // myDialogInstance.set("dateValue", 1234) // will automatically set the input.value, do as follows _setDateValueAttr: function(val) { // NB: USING dojoAttachPoint REFERENCE this.numberOfDateNode.value = val; }, // and in turn we must set up the getter _getDateValueAttr: function() { // NB: USING dojoAttachPoint REFERENCE return this.numberOfDateNode.value; } }); });
0
source

More articles:


All Articles