Question

The normal JSON approach looks something like this:

{
  "list": [
    {
      "header1": "some value",
      "header2": "some other value"
    },
    {
      "header1": "some value",
      "header2": "some other value"
    },
    {
      "header1": "some value",
      "header2": "some other value"
    },
    ...
  ]
}

But when I use this, there is a major overhead, because of all the “header1” and “header2” stuff.

So I thought about a more CSV like approach:

{
  "headers": [ "header1", "header2" ],
  "list": [
    [ "some value", "some other value" ],
    [ "some value", "some other value" ],
    [ "some value", "some other value" ],
    ...
  ]
}

but the ExtJS4 stores are more fond of the first style. Is there an easy possibility to use the second format or should I convert it on the client?

Answer 1

You should be using Ext.data.Store with an array reader and ajax proxy. You do not need any headers on the server side, you should just define what your headers are going to be in the model on the client side. So for an example, you could use code like this on the client side:

Ext.define("MyModel", {
    extend: "Ext.data.Model",
    fields: [
        {name: "header1"},
        {name: "header2"}
    ]
});
var theProxy = new Ext.data.proxy.Ajax({
    timeout: 120000,
    method:  "POST",
    url:     "your_url_here",
        reader:  new Ext.data.reader.Array({
            root:          "list"
        })
});
var store = new Ext.data.Store({
    proxy:      theProxy,
    model:      "MyModel"
});

Make sure when you define the model that the fields are in the same order as the array returned from the server.
And this would be what is returned by the server:

{
  "list": [
    [ "some value", "some other value" ],
    [ "some value", "some other value" ],
    [ "some value", "some other value" ],
    ...
  ]
}