Opened 10 years ago

Closed 10 years ago

Last modified 10 years ago

#8272 closed defect (invalid)

Programmatic Creation of FormWidget clobbers name attribute

Reported by: nlusher Owned by:
Priority: high Milestone: tbd
Component: Dijit Version: 1.2.0
Keywords: Programmatic FormWidget Input Name Attribute Cc:
Blocked By: Blocking:

Description (last modified by bill)

For form widgets like diji.form!.TextBox? the name attribute seems to get clobbered even when the template suggests that ${name} should be token-replaced. The cause appears to be that _FormWidget declares a 'name' property with a default value of "". However, the original dom element is never inspected for a specified name attribute. This may also be the case for other attributes which have specified defaults in _FormWidget like 'alt' and 'tabIndex'.

For Example

...
    dojo.require("dojo.parser");
    dojo.require("dijit.form.ValidationTextBox");
    dojo.addOnLoad(function() {
    var valTB = new dijit.form.ValidationTextBox({
        title: 'Validating Text Box',
        regExp: "[\\w]+",
        required: true,
        invalidMessage: "That won't work!"
    },'someTb');
})
...

...
 <input id="someTb" name="someTb" class="long" type="text" tabIndex="4" alt="some alternate text"/>
...

Yeilds

...
<input type="text" name="" autocomplete="off" dojoattachevent="onfocus:_update,onkeyup:_update,onblur:_onMouse,onkeypress:_onKeyPress" dojoattachpoint="textbox,focusNode" class="dijitReset" id="rtsPhrase" tabindex="0" aria-required="true" aria-invalid="true" value=""/>
...


This only happens when the widget is created in programmatic fashion. The name attribute is properly maintained when the TextBox? is created in the declarative (in-line HTML) way.

Two (naive) workarounds

One way around this seems to be to override postMixInProperties and manually copy pertinent attributes from this.srcNodeRef. Something like:

 if(this.srcNodeRef && this.srcNodeRef.name) {
    this.name = this.srcNodeRef.name;
 }

Alternatively, one can specify the name by including it in the constraints passed at widget construction time, but it doesn't seem like this should be necessary - it tends to lead to repeating myself (not very "DRY").

Change History (3)

comment:1 Changed 10 years ago by nlusher

One correction - the ID for the input element in the 'Yeilds' section is incorrect. It should be:

<input type="text" name="" autocomplete="off" dojoattachevent="onfocus:_update,onkeyup:_update,onblur:_onMouse,onkeypress:_onKeyPress" dojoattachpoint="textbox,focusNode" class="dijitReset" id="someTb" tabindex="0" aria-required="true" aria-invalid="true" value=""/>

comment:2 Changed 10 years ago by bill

Description: modified (diff)
Resolution: invalid
Status: newclosed

It's not clobbered, it's that you haven't specified it in the parameters. You specified it in the markup but markup is only relevant when you are using the parser.

This should work:

    var valTB = new dijit.form.ValidationTextBox({
       name: 'foo',
       ...
    },'someTb');
})

comment:3 Changed 10 years ago by bill

PS: This is by design. Although it's annoying to have to specify name in two places, it's important to not build-in assumptions about how the parser works into dijit. Remember that there are alternate parsers with alternate syntaxes for specifying widget parameters, like for XHTML.

Note: See TracTickets for help on using tickets.