sorted ItemFileReadStore list not pushed to dropdown menu // Dojo, ArcGIS

Question

this may be more a Dojo question than ArcGIS, but I am not sure if the Javascript API is related to this issue.

I am trying to alphabetically sort a Dojo store and show these items in a dropdown list, based on this example: http://dojotoolkit.org/reference-guide/1.8/dojo/data/ItemFileReadStore.html

I can see in Firebug that my list is being sorted, but the sorted list is not displayed in the dropdown menu; the items there are still sorted by ObjectID. I am not sure if I need to run my 'set' function differently, or if I am missing some code to replace the store list with the newly sorted list...ideas? // Jason

code:

    var dataItems = {
        identifier: 'name',
        label: 'name',
        items: values,

    };


var menuStore = new dojo.data.ItemFileReadStore({ data: dataItems });  
menuStore.comparatorMap = {};

menuStore.comparatorMap['name']=function(a,b){
    if(a<b) return -1;
    if(a>b) return 1;
    return 0;
};

 var sortAttributes = [{attribute: "name", ascending: true}];
function completed(items, findResult){
    for(var i = 0; i < items.length; i++)
    {
        var value = menuStore.getValue(items[i], "name");
        console.log("Item ID: [" + menuStore.getValue(items[i], "name"));
        //// this console statement produces a sorted list in Firebug //// 
    }

}
function error(errData, request){
    console.log("Failed in sorting data.");
}

menuStore.fetch({onComplete: completed, onError: error, sort: sortAttributes});     
//  dijit.byId("schoolMenu").store = menuStore;   // may need this if an older version of API is used 

  dijit.byId("schoolMenu").set ("store", menuStore); // schoolMenu is dropdown menu     
} // end function

Answer 1

Since you're using the v3.1, which uses Dojo 1.7 (scroll to the bottom of this page), I looked up whether this works. The answer depends on whether your dropdown is a dijit.form.Select or a dijit.form.ComboBox

dijit.form.Select

You'll want to use the dropdown menu's .setStore function (outlined here). Just using dijit.byId("schoolMenu").set("store", menuStore) does not refresh the options in the dropdown like dijit.byId("schoolMenu").setStore(menuStore). Also, according to the documentation, setStore returns the original Select, in case you want to use it somewhere else.

dijit.form.CombBox

For a combobox, there's a way to refresh the choices inside it without creating a new ItemFileReadStore. Just set the combobox's internal store's clearOnClose to true, replace the data within the combobox's internal store, and then close it. (see here for details).

var combobox = dijit.byId("schoolMenu");
combobox.store.clearOnClose = true;
combobox.store.data = menuStore.data;
combobox.store.close();
// combobox should be reset to autocomplete with new values.