RyanP13
RyanP13

Reputation: 7743

Attempting to load Ext store with JSON data from AJAX request returns error

Am attempting to load and Ext Store with Ext 4.0.7.

It is returning an Object doesn't support this property or method error when i call the loadRawData method on the store in the success callback of the AJAX request.

Here is the data i am loading:

{
    "data": [
    {
        "id": 1,
        "source": "1445261",
        "target": "1437043",
        "sourceType": "user",
        "redirectUrl": "http://www.google.co.uk",
        "message": "this is a notification message",
        "targetType": "user",
        "messageType": "notification",
        "sentDate": "1354758001",
        "notificationType": "notification",
        "parameters": "null",
        "read": "false",
        "readDate": 1354758001
    }, 
    {
        "id": 2,
        "source": "1445261",
        "target": "1437043",
        "sourceType": "user",
        "redirectUrl": "http://www.google.co.uk",
        "message": "this is a notification message",
        "targetType": "user",
        "messageType": "notification",
        "sentDate": "1354758001",
        "notificationType": "notification",
        "parameters": "null",
        "read": "false",
        "readDate": 1354758001
    },  
    {
        "id": 3,
        "source": "1445261",
        "target": "1437043",
        "sourceType": "user",
        "redirectUrl": "http://www.google.co.uk",
        "message": "this is a notification message",
        "targetType": "user",
        "messageType": "notification",
        "sentDate": "1354758001",
        "notificationType": "notification",
        "parameters": "null",
        "read": "false",
        "readDate": 1354758001
    } 
    ]
}

This is the store code and ajax request:

var infoStagingStore = Ext.create('Ext.data.Store', {
    model: 'SCB.RMWB.InfoBar.Model.Message',
    storeId: 'Staging',
    autoLoad: false,
    pageSize: 10,
    proxy: {
        type: 'pagingmemory',
        reader: {
            type: 'json',
            root: 'data'
        }
    },
    listeners: {
        load: function(){
            console.log('loaded');
        }
    }   
});

Ext.Ajax.request({
    url: '/rmwb/resources/js/app/infoBar/data/data.json',
    timeout: 60000,
    method: 'GET',
    scope: this,
    params: '',
    success: function(resp) {
        console.log(resp.responseText);
        var store = Ext.data.StoreManager.lookup('Staging');
        store.loadRawData(resp.responseText, true);
    },
    failure: function(resp, opts) {

    },
    callback: function(options, success, resp) {
    }
}); 

Can't quite see why this is returning an error?

Upvotes: 1

Views: 12352

Answers (2)

lontivero
lontivero

Reputation: 5275

As in my comment, you don´t need a pagingmemory store. What you need is an ajax store because the pagingstore is for allowing pagination with data you have in memory but there is no reason to use it seeing your requirement.

So if you use an standard ajax proxy, you will be able to load it in the normal way (using the .load() method). Then, when you need to add more record from the server you what you have to do is just call the load method again but with the addRecords option.

For example (untested sample):

// load store with historical data
infoStagingStore.load(); 

// load more records to the store from a different resource
infoStagingStore.load({
    url: '/rmwb/resources/js/app/infoBar/data/data.json',
    addRecords: true
});

Upvotes: 3

dougajmcdonald
dougajmcdonald

Reputation: 20037

Seeing as you've assigned your store to a variable called infoStagingStore could you not just reference that directory in your ajax call?

Ext.Ajax.request({
    url: '/rmwb/resources/js/app/infoBar/data/data.json',
    timeout: 60000,
    method: 'GET',
    scope: this,
    params: '',
    success: function(resp) {
        console.log(resp.responseText);
        //var store = Ext.data.StoreManager.lookup('Staging');
        infoStagingStore.loadRawData(resp.responseText, true);
    },
    ...

Upvotes: 3

Related Questions