All geek questions in one place

Dojo element / widget targeting, what am I doing wrong?

I am completely new to dojo ... and drawing from my experience with jQuery a few ...

I have a few elements:

<input name="info1" value="" style="width:52px" contstraints="{pattern:'#'}" dojoType="dijit.form.NumberTextBox"/> <input name="info2" value="" style="width:52px" contstraints="{pattern:'#'}" dojoType="dijit.form.NumberTextBox"/> <input name="info3" value="" style="width:52px" contstraints="{pattern:'#'}" dojoType="dijit.form.NumberTextBox"/>

But my hardest part is to assign a simple onKeyUp event ... everything I tried seems to work, but not ... the console always reports that the thing I'm trying to do is not a function ...

 dojo.addOnLoad(function() { dojo.query('input[name^=info]').connect('onkeyup',function(e) { console.log('oh yeah'); }); });

What am I doing wrong, what should I look for?

+4
source share
2 answers

Unfortunately, dojo.query() will only return native DOM nodes. I think you want to bring back the rendered Dijit widget.

To do this, you need to assign the identifiers of your input data and use dijit.byId() .

In addition, unlike HTML custom event names, Dojo event names are case sensitive. Thus, onkeyup refers to its own HTML code and is different from the Dojo onkeyup event onkeyup .

I think you can also add "t" to contstraints .

Usage example:

 <html> <head> <title>Test</title> <link type="text/css" rel="stylesheet" href="dijit/themes/tundra/tundra.css"/> </head> <body class="tundra"> <input id="input1" name="input" type="text"dojoType="dijit.form.NumberTextBox"/> <script type="text/javascript" src="dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script> <script type="text/javascript"> dojo.require("dijit.form.NumberTextBox"); dojo.addOnLoad( function() { dojo.connect(dijit.byId("input1"), 'onKeyUp', function(e) { console.log('oh yeah'); }); } ); </script> </body> </html>
+2
source

Dojo makes it easy to announce events without pain when passing requests. Just put the event right in your markup. See http://docs.dojocampus.org/quickstart/events#events-with-dijit

 <input name="info1" value="" style="width:52px" constraints="{places:0}" dojoType="dijit.form.NumberTextBox" onkeyup="console.log('key up')" />

This is more eloquent, and you do not need to point and look for links just to bind the event.

In any case, abboq is right, you usually want to deal with widgets directly, and not with the DOM node, since creating a Dijit instance often ends with a restructuring of the DOM, so it is very different from the original one. The widget acts as an abstraction.

0
source

Source: https://habr.com/ru/post/1300327/

More articles:


All Articles