Login Register

How to reflect fetch of ItemFileReadStore on FilteringSelect?

I got the result value of fetch. And then, I am wondering how to reflect that
on FilteringSelect. Without the fetch, I used the store attribute of FilteringSelect.However, with fetch, I am thinking to deal with gotList.
I hope for some advice to implement that.

<head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>QueryReadStore Demo</title>
       
        <style type="text/css">
           @import "../dojoroot/dijit/themes/tundra/tundra.css";
           @import "../dojoroot/dojo/resources/dojo.css"
        </style>
         <script type="text/javascript" src="../dojoroot/dojo/dojo.js"
         djConfig="isDebug: true, parseOnLoad: true">
</script>
        
        <script type="text/javascript">
                    dojo.require("dojo.parser");
                    dojo.require("dijit.form.FilteringSelect");
                    dojo.require("dojo.data.ItemFileReadStore");
                    
                        var pantryStore = new dojo.data.ItemFileReadStore({url: "pantry_spices.json" } );
                        //Define a callback that fires when all the items are returned.
                        var gotList = function(items, request){
                            var itemsList = "";
                                              
                            for (var i = 0; i < items.length; i++){
                               itemsList += pantryStore .getValue(items[i], "name") + " ";
                            }
                            alert("All items are: " + itemsList);
                            //return items;
                            //dojo.Byid("fs").store=pantryStore;
                            
                        }
                        var gotError = function(error, request){
                            console.debug("The request to the store failed. " +  error);
                        }
                        //Invoke the search
                        pantryStore.fetch({
                                onComplete: gotList,
                                onError: gotError,
                                query: { name: "B*", aisle: 'Spices' },
                        });
        </script>

       
    </head>
   
    <body class="tundra">
        <input id="fs" dojoType="dijit.form.FilteringSelect" store="pantryStore" pageSize="5" />
    </body>

I probably don't quite

I probably don't quite understand why you are wanting to do the fetch, perhaps some other processing not related to the FilteringSelect?

If you are just trying to make query work with the FilteringSelect, there appears to be something broken with FilteringSelect queries, at least on my PC.

You should be able to:

and not do any of the other fetch-related code above.

However, it looks like FilteringSelect always forces the identifier field name to have a query of "*". Until this is fixed (maybe it is by design??), you will need to do your queries on other fields. A way around this is to include an extra field in each item that can serve as the identifier; however, the identifier field must be a field whose values are unique (not repeated in the data store). In your case, you could have json data similar to:

{identifier: 'id', items: [{id: 1, name: 'Babc', aisle: 'Spices'}, {id: 2, name: 'Aabc', aisle: 'Spices'}, {id: 3, name: 'B123', aisle: 'Butter'}]}

with the above query.

Note: minor typo in your code above (space after pantryStore and before the "."):

itemsList += pantryStore .getValue(items[i], "name") + " ";