javascript - ¿Cuál es la forma correcta de pasar el parámetro de evento en DOJO?

custom-widgets ibm-content-navigator

Question

Estoy trabajando en la versión 1.8 de Dojo. He diseñado un widget personalizado como el siguiente. Es un fragmento

<div>
<div>
<input
id ="NZ1",
data-dojo-attch-point = "NZ1"
data-dojo-attch-type = "ecm.widget.ValidationTextBox"
data-dojo-attch-event = "onBlur : makeAllSmall"
/>
</div>
<div>
<input
id ="NZ2",
data-dojo-attch-point = "NZ2"
data-dojo-attch-type = "ecm.widget.ValidationTextBox"
data-dojo-attch-event = "onBlur: makeAllSmall"
/>
</div>
</div> 

Aquí está el controlador de eventos

makeAllSmall : function(evt){
var currVal=evt.target.value;
currVal = currVal.toLowerCase();
/**Some Other business logic on currVal **/
}

Este evt siempre viene como indefinido. Soy bastante nuevo en Dojo. ¿Me estoy perdiendo algo en el lado de HTML? Traté de cambiar HTML como a continuación pero no suerte

 <input
id ="NZ2",
data-dojo-attch-point = "NZ2"
data-dojo-attch-type = "ecm.widget.ValidationTextBox"
data-dojo-attch-event = "onBlur : makeAllSmall"
data-dojo-args="e"
/>

Answer 1

Primero, ¿hay un error tipográfico en el método "onBlurr"? Veo que hay una ''r'' extra. ¿No debería ser "onBlur"?

Si mira la documentación de la API de DOJO para el evento onBlur, no pasa un objeto de evento como lo que está esperando

onBlur()
Defined by: dijit/_FocusMixin
Called when the widget stops being "active" because focus moved to something outside of it, or the user clicked somewhere outside of it, or the widget was hidden.
Examples
Example 1
var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
this.set("label", v);
});

A continuación, en su controlador de eventos, está tratando de cambiar el texto a lowerCase y esto se puede hacer como

makeAllSmall : function(){
var currVal=this.get("value");
currVal = currVal.toLowerCase();
/**Some Other business logic on currVal **/
}

Otra forma de hacerlo sin el controlador de eventos es forzar a ValidationTextBox a convertir todo a minúsculas usando parámetros de construcción como

<input
id ="NZ2",
data-dojo-attach-point = "NZ2"
data-dojo-attach-type = "ecm.widget.ValidationTextBox"
data-dojo-props=''lowercase:true''
data-dojo-attach-event = "onBlurr : makeAllSmall"
/>

Tenga en cuenta que he agregado data-dojo-props=''lowercase:true''

Espero que esto ayude.

Answer 2

Debería poder adjuntar un evento DOM a su widget personalizado de la siguiente manera:

• El uso de datos de atributos de data-dojo-attach-event en el marcado.
• Y usando _AttachMixin pasando su función callBack.

Ejemplo:

<div id="somenode"><span data-dojo-attach-point="anattachpoint"
data-dojo-attach-event="click: clicked">Click me</span></div>
var MyDijit = declare([ _WidgetBase, _AttachMixin ], {
// .. declaration goes here ..
clicked: function(e) {
// handle event
}
});
// instantiate the dijit instance, which will attach to the ''somenode'' div.
var mydijit = new MyDijit({}, dom.byId(''somenode''));
mydijit.startup();