CODEWITHSUNDEEP
dojoreloaddatastoredijit.form
Jon Mitchell
Jon Mitchell

Reputation: 217

How do I reload a FilteringSelect in Dojo 1.7?

I have created a FilteringSelect with the following code:

    var type = $('fMatlTypeId').value;

    var eSelect, dataStore;
    require([
        "dijit/form/FilteringSelect",
        "dojo/store/Memory",
        "dojo/data/ObjectStore",
        "dojo/_base/xhr",
        "dojo/parser",
        "dojo/domReady!"
    ], function(FilteringSelect, Memory, ObjectStore, xhr){
        xhr.get({
            url: 'adminservices/admin/materialType/assignedFacilities/' + type + '/',
            handleAs: "json"
        }).then(function(data){
            dataStore =  new ObjectStore({ objectStore:new Memory({ data: data.items }) });

            eSelect = new FilteringSelect({
                id: 'fMatlTypeFacilities',
                store: dataStore, 
                searchAttr: 'nameStatus',
                queryExpr: '*${0}*',
                ignoreCase: true,
                autoComplete: false,
                style: 'width:200px',
                required: true
            }, document.createElement('div'));

            // Append to the div
            $('FS_MatlTypeFacilities').innerHTML = '';
           dojo.byId("FS_MatlTypeFacilities").appendChild(eSelect.domNode);

            eSelect.startup();

            eSelect.setValue(dataStore.objectStore.data[0].id);
        });
    });

Now if the data changes in the backend how do I reload it?

I have tried the following code and when I debug it in Firebug the store gets updated but not the FilteringSelect. 

    var eSelect, dataStore;
    require([
        "dijit/form/FilteringSelect",
        "dojo/store/Memory",
        "dojo/data/ObjectStore",
        "dojo/_base/xhr",
        "dojo/parser",
        "dojo/domReady!"
    ], function(FilteringSelect, Memory, ObjectStore, xhr){
        xhr.get({
            url: 'adminservices/admin/materialType/assignedFacilities/' + type + '/',
            handleAs: "json"
        }).then(function(data){
            dataStore =  new ObjectStore({ objectStore:new Memory({ data: data.items }) });
            dataStore.fetch();

            eSelect = dijit.byId('fMatlTypeFacilities');
            eSelect.store.close();
            eSelect.store = dataStore;
            eSelect.startup();
         });
     });

Any suggestions?

The only thing I have found to work is simply destroy the widget each time and let it rebuild. So I added the following code before the above create code. But there has got to be a way to simply reload it.

if (dijit.byId('fMatlTypeFacilities')) dijit.byId('fMatlTypeFacilities').destroy();

Upvotes: 1

Views: 5566

Answers (1)

Michael Dandini
Michael Dandini

Reputation: 313

Try changing:

eSelect.store = dataStore;

to

eSelect.set('store', dataStore);

In general, you should access a dijit's properties through myDijit.set('');. See here for more details

Upvotes: 3

Related Questions