Unique values in Sencha Touch store

I am developing a mobile app in Sencha Touch and have the need to store details of previous searches locally without duplication.

The searching, storing and displaying works fine, however if I do the same search twice the entry gets duplicated in my store.

I expected that the "id" of the store would do this but something seems wrong.

Here is the code for the store.

    Ext.regModel('sSaved', {
        fields: [
            {name: 'IDs',        type: 'int'},
            {name: 'Outward',        type: 'string'},
            {name: 'Return',        type: 'string'},
            {name: 'Pickup',        type: 'string'},
            {name: 'Destination',        type: 'string'}
        ],
        proxy: {
            type: 'localstorage',
            id:'IDs'
        }
    });             

    var savedJobs = new Ext.DataView({
        store: new Ext.data.Store({
            model: 'sSaved',
            storeId: 'allSaved开发者_JS百科'     
        }),
        tpl: new Ext.XTemplate(
            '<tpl for=".">',
                '<table class="item" style="margin:auto;">',
                    '<tr><td class="title">ID</td><td>{IDs}</td></tr>',
                    '<tr><td class="title">Outward</td><td>{Outward}</td></tr>',
                    '<tr><td class="title">Return</td><td>{Return}</td></tr>',
                    '<tr><td class="title">Pickup</td><td>{Pickup}</td></tr>',
                    '<tr><td class="title">Destination</td><td>{Destination}</td></tr>',
                '</table>',
            '</tpl>'
        ),
        itemSelector: "table.item",
        autoHeight:true,
        emptyText: 'No Saved Jobs',
        autoLoad: true
    });     

And the code which sets the store.

    var fetched = Ext.decode(result.responseText);
    var details = fetched.apiResponse.details;
    savedJobs.store.load();
    savedJobs.store.add({
        "IDs":details.ID, 
        "Outward":details.Outward,
        "Return":details.Return,
        "Pickup":details.Pickup,
        "Destination":details.Destination
    });
    savedJobs.store.sync();

I could work around this by somehow searching the store and checking whether the value exists before adding, however I'm sure there is a simpler method.

If this search->check->add is the approach that's needed, what is the least resource intensive way?

---

Checking for existing values won't hurt - I promise ;) Also, you should do your add() AFTER the load() has finished. Since loading is asynchronous (without async: false in the config), you MUST either specify anything that depends on that data to happen 1) via the 'load' event of the store or 2) by specifying the callback method for the store's load config:

var fetched = Ext.decode(result.responseText);
var details = fetched.apiResponse.details;
savedJobs.store.load({
    callback: function() {
        if(!savedJobs.store.getById(details.ID) {
            savedJobs.store.add({
                "IDs":details.ID, 
                "Outward":details.Outward,
                "Return":details.Return,
                "Pickup":details.Pickup,
                "Destination":details.Destination
            });
        }
    }
});

savedJobs.store.sync();