Store with json reader is not working

Question

I have following json created after I sereliaze a dictionary

{"Results":["{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}"],"Total":4}

When I try to load it into the extjs store , the store is not loaded

var store = Ext.create('Ext.data.Store', {
    fields: fields,
    pageSize: itemsPerPage,
    proxy: {
    type: 'ajax',
    url: getDataWithPageURL,
    reader: {
    type: 'json',
    root: 'Results',
    totalProperty: 'Total'
            }
    }
});

But if I remove slash hard coded and it's working

{"Results":["{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD"}"],"Total":4}

I create json using Newtonsoft.Json

Dictionary<string, object> dict = new Dictionary<string, object>();

            string s = JsonConvert.SerializeObject(dist);

How can I remove slash in server side in order to produce valid json for extjs store.

I tried

result = result.Replace("\"","'");

And

result =result.Replace("\"", @"""")

It's not working

James Clark James Clark · Accepted Answer · 2011-12-08T20:56:48

Clearly, Ext doesn't like that you have encoded a json object as a string and then put them in another json object. You have two options that I see.

See if you can return the dict on the server-side without first converting it into a string. Some code, somewhere, is taking your string and putting it in a json object with 'Results' and 'Total'. Check to see if that code can take a Dictionary as-is.
Unwrap the 'Results' propery on the client-side. One way would be to make your own reader:

Ext.define('MyReader', {
  extend: 'Ext.data.reader.Json',
  alias: 'reader.my-json',
  read: function(object) {
    object.Results = Ext.Array.map(object.Results, Ext.decode);
    return this.callParent([object]);
  }
});

Then use type: 'my-json' in your reader config.

Here is my test case:

var data = {"Results":["{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}"],"Total":4};

Ext.define('Currency', {
  extend: 'Ext.data.Model',
  fields: [
    { name: 'BaseCurrency', type: 'string' },
    { name: 'TermCurrency', type: 'string' }
  ]
});

Ext.define('MyReader', {
  extend: 'Ext.data.reader.Json',
  alias: 'reader.my-json',
  read: function(object) {
    object.Results = Ext.Array.map(object.Results, Ext.decode);
    return this.callParent([object]);
  }
});

var store = Ext.create('Ext.data.Store', {
  model: 'Currency',
  data: data,
  proxy: {
    type: 'memory',
    reader: {
      type: 'my-json',
      root: 'Results',
      totalProperty: 'Total'
    }
  }
});

Store with json reader is not working

1 Answers