Converting Sencha Touch 2.4 Store Data into JSON

Question

I have a WebAPI endpoint that accepts some JSON objects as the parameter and returns a collection of other data.

Here is a working request:

POST http://mylocalmachine/api/Search
Accept: application/json
Content-Type: application/json
[
{'filterName' : 'ProductType','filterValue' : 'Shoes'}
]

In Sencha Touch, I've created a store ('SearchFilters') that will hold a collection of "filters" which I want to send as the request body for a different store ('MyData').

Ext.define('MyApp.store.SearchFilters', {
    extend: 'Ext.data.Store',

    requires: [
        'Ext.data.Field'
    ],

    config: {
        autoLoad: true,
        data: [
            {
                filterName: 'ProductType',
                filterValue: 'Shoes'
            },
            {
                filterName: 'Region',
                filterValue: 'NorthWest'
            }
        ],
        storeId: 'SearchFilters',
        fields: [
            {
                name: 'filterName',
                type: 'string'
            },
            {
                name: 'filterValue',
                type: 'string'
            }
        ]
    }
});

Since the filters can be changed (or loaded from the database later on), I'm trying to attach the JSON payload to the 'MyData' store request before it fires the Load like this:

onStoreBeforeLoad: function(store, operation, eOpts) {
        var filterData = Ext.getStore('SearchFilters').getData();
        operation.request.setJsonData(Ext.JSON.encode(filterData));
    }

The problem I'm running into is the Ext.JSON.encode function is throwing an error when trying to convert the data from the 'SearchFilters'. The error is a 'Stack Overflow' and if I set a break point and watch it, there appears to be an infinite loop. Obviously I'm grabbing more than the few filter records in the 'SearchFilter' store.

What is the correct way to convert a few records in a store to JSON format?

Answer 1

You can easily retrieve your Store data as JSON:

var json = store.proxy.reader.jsonData;

Answer 2

Rot put my on the right track, but the jsonData property is a member of 'Ext.data.Request' not 'Ext.data.reader.Json'.

I did try to use the getRange method, as suggested by Sujata

Ext.encode(Ext.getStore('SearchFilters').getRange()); //Did not work

...but it too throws the stack overflow error

I was finally able to encode the full set of stored models using the following:

Ext.encode(Ext.getStore('SearchFilters').getProxy().getReader().rawData); //Works

Now all I need to figure out is how to attach it to the outgoing request object and I'll be set...but that is for a separate question if I can't figure it out.