Question

I’m trying to add a new FilteringSelect widget dynamically to a preexisting form I made out of declarative tags (on page load).

prereqs = 0;
function addAnotherPrerequisite(){  

    var newPreReqCursor = dijit.byId("Prerequisite"+(prereqs-1)).domNode;
    dojo.create("input",{
        id:"prerequisite"+prereqs,
        jsId:"Prerequisite"+prereqs,                        
        dojoType:"dijit.form.FilteringSelect",
        store:"PrerequisitesStore",
        searchAttr:"name",
        style:"width: 350px;",
        required:"true",
        class: "appendedPreReq"},newPreReqCursor,"after");


    dojo.parser.parse( newPreReqCursor.parentNode ); 

    prereqs++;
}

This code properly builds a FilteringSelect widget, but the widget does not seem to be registered with the form. Whenever I submit the form, none of the values in the new widgets appear. The validation attribute works, though, and it properly pulls the values from the store.I can even call the new widget via its jsId(Prerequisite1, Prerequisite2, etc) It just won’t POST!

Instead of dojo.create I also tried called the FilteringSelect widget directly. This also made the widget, but did not register the values with the form during POSTing.

var filteringSelect = new dijit.form.FilteringSelect({
        id: "prereq"+prereqs,
        jsId: "Prerequisite"+prereqs,
        store: PrerequisitesStore,
        searchAttr: "name",
        required: true,
        style: 'width: 350px;',
        class: 'appendedPreReq'
    },
    "prerequisite"+prereqs).startup();

I’m going crazy trying to figure this out.

Answer 1

So it looks like there’s some sort of bug or something. I had to define the ‘name’ attribute explicitly to get the widget to show up in my form’s .getDependents() method. That’s how dijit.forms gets its list of form values. After doing this I also couldn’t access this widget by dijit.byId (didn’t return anything, silently caught the error I guess), so I returned the object via its jsId with an eval.

prereqs = 0;
function(){
    var newPreReqCursor = eval("Prerequisite"+(prereqs-1));
    newPreReqCursor = newPreReqCursor.domNode;

    dojo.create("input",{
            id:"Prerequisite"+prereqs,
            name:"Prerequisite"+prereqs,
            jsId:"Prerequisite"+prereqs,
            dojoType:"dijit.form.FilteringSelect",
            store:"PrerequisitesStore",
            searchAttr:"name",
            style:"width: 350px;",
            required:"true",
            class: "appendedPreReq"},newPreReqCursor,"after");

    var filterSelect = dojo.parser.parse( newPreReqCursor.parentNode );
}