Login Register

HowTo: Programmatically create ComboBox/FilteringSelect widgets

I've noticed a number of people ask how to create the store needed for these kinds of widgets and the method isn't really document in the dojo book. After some digging around I found how to create these widgets programmatically and thought I'd share the solution:

dojo.require("dijit.form.ComboBox");
dojo.require("dojo.data.ItemFileWriteStore");
var jsonData = { identifier: "index", items: [], label: "number" };
var phoneNumberStore = new dojo.data.ItemFileWriteStore( { data: jsonData } );
phoneNumberStore.newItem({index:0,number:"805 232-4242"});
phoneNumberStore.newItem({index:1,number:"333 333-3333"});
       
var w = new dijit.form.ComboBox({name:"phoneNumber",autocomplete:true,
                searchAttr:"number",store:phoneNumberStore,trim:true},"idOfHtmlNode");

I believe you could also initialize the data in the items parameter instead of using the newItem() method similar to this example from the dojo book:

items: [
        {name:"Alabama", label:"Alabama",abbreviation:"AL"},
        ...
       ]

Again, this is just the solution I found, if someone knows a better way of doing this please say so.

-Arlo