Question

So, I know I can query for nodes not just in the entire DOM but also within a context node, like this:

var myNode = dojo.query('#formId', 'idContext');

This way I can get the right node even if there is another using the same id in the DOM.

What I’m trying is to create widgets based on a contextualized node. Instead of :

    new Form({
        method: 'post',
        action: 'aaa/bbb'
    }, 'formId');

I’m trying

    new Form({
        method: 'post',
        action: 'aaa/bbb'
    }, myNode);

But FBug logs the error:

TypeError: _13.hasChildNodes is not a function
[Break On This Error]   

while(_13.hasChildNodes()){

So, it seems I’m setting a wrong object in Form’s second parameter… The usage explained in dojo docs says:

Usage:
var foo = new dijit.form.Form(/* Object? */ params, /* **DomNode**|String */ srcNodeRef);

I feel I’m misunderstanding something here… Wut do you think?

Thanks…

Answer 1

It seems you are passing a dojo NodeList object as the second parameter to the Form constructor. The dojo.query method returns a NodeList, not a single dom element. The second (optional) parameter to a Widget constructor is a single dom node, not a Node List.

The following works

require(['dojo/dom','dijit/form/Form'],function(dom,Form){
    new Form({
        method: 'post',
        action: 'aaa/bbb'
    }, dom.byId('formId'));
}); 

It probably goes without saying that having multiple elements with the same ID on a page​ is a bad practice, but it you absolutely need to do that, you can do something like dojo.query('#testNode','idContext')[0] to get the first node with the id testNode rooted at the node with the id idContext.

require(['dojo/query','dijit/form/Form'],function(query,Form){
    new Form({
        method: 'post',
        action: 'aaa/bbb'
    }, query('#formId','idContext')[0]);
});