ansaurus

Question

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

Answer 1

+2 A:

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

To do that, you'll need to assign your inputs IDs and use dijit.byId().

Also, unlike native HTML event names, Dojo event names are case-sensitive. So, onkeyup refers to the native HTML and is different from the Dojo event name onKeyUp.

I think you may also have an extra 't' in contstraints.

An example usage:

<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>

Abboq 2010-02-04 20:27:43

If you want a Dijit, there's no need to go around assigning id's to everything. Just pass the result of dojo.query in to dijit.byNode to get the widget reference.

peller 2010-02-05 02:04:01

after the widget is initialized the dom is changed, passing in the original elem node to dijit.byNode does NOT return the widget

farinspace 2010-02-05 05:04:53

oh yeah, form elements are special. They actually leave the input control by name in place so a normal form submit works, and they create a separate structure to deal with UI presentation. You're right -- you'd need to craft your query a different way, like using the dojoType or id... it's just easier to bind directly to the widget when you create it.

peller 2010-02-05 18:34:29

Answer 2

A:

Dojo makes it easy to declare events without the pain of going through queries. 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')" />

It's more concise, and you don't need to name and look up references just to bind the event.

Either way, abboq is right, you'll usually want to deal with the widget directly rather than the DOM node, since instantiating a Dijit often ends up restructuring the DOM so that it looks very different from the original page. The widget acts as an abstraction.

peller 2010-02-04 20:38:21

ya the dom gets changed by dojo, the other problem i'm having is how to get a collection of those elements after the dom has been restructured (after the widget has been intialized)...

farinspace 2010-02-05 04:58:58

ansaurus

tags:

views:

answers:

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

related questions