开发者

Sencha Touch RestProxy with Rails example needed

I've got the following model

Ext.regModel("Entries", {
    fields: [
        {name: "id",             type: "int"},
        {name: "title",           type: "string"},
        {name: "bought",         type: "boolean"},
   ],
    proxy: {
        type: 'rest',
        url: '/lists',
        format: 'json',
        reader: {
            type: 'json'
        }
    }
});

Then I've got a list, which is populated from this model

...
store: new Ext.data.Store({
            model: "Entries",
            autoLoad: true,
            remoteFilter: true
        }),
...

The list is populated correctly. But when I try to perform the following

   listeners: {
            itemswipe: function (record, index, item, e) {
                var el = Ext.get(item);
                el.toggleCls("crossedOut");
                var store = record.getStore();
                var rec = store.getAt(index);
                if (el.hasCls('crossedOut')) {
                    rec.set('bought', true);
                    rec.save({
                        success: function() {
                            console.log("Saved!");
                   开发者_开发知识库     }
                    });
                } else {
                    console.log('not crossed out');
                    rec.set('bought', false);
                    rec.save({
                        success: function() {
                            console.log("Saved!");
                        }
                    });
                }
            }
        }

when swipe event is fired, I've got the following error

Uncaught TypeError: Cannot read property 'data' of undefined gsencha-touch.js:6
(anonymous function) sencha-touch.js:6
Ext.data.Connection.Ext.extend.onCompletesencha-touch.js:6
Ext.data.Connection.Ext.extend.onStateChangesencha-touch.js:6
(anonymous function)

I understand, that there is some problem with the payload I return, but I can't find an example of the correct one, and all my guesses do not work.

In backend I return the following

format.json {render :json => {:data => @list, :success=> true, :id => @list.id}}


I'm using the ExtJS 4 preview, but it should work the same with Sencha Touch. Your problem might be related to the nesting of the returned json. Here's what works for me.

In the Rails controller:

def index
  respond_with @entries = Entry.all do |format|
    format.json { render :json => {:success => true, :data => @entries, :total => @entries.count} }
  end
end

def show
  respond_with @entry = Entry.find(params[:id]) do |format|
    format.json { render :json => {:success => true, :data => [@entry]} }
  end
end

def create
  respond_with @entry = Entry.create(params[:records][0]) do |format|
    format.json { render :json => {:success => true, :data => [@entry]} }
  end
end

def update
  @entry = Entry.find(params[:id])
  @entry.update_attributes(params[:records][0])
  respond_with @entry do |format|
    format.json { render :json => {:success => true, :data => [@entry]} }
  end
end

ExtJS model:

Ext.regModel("Entries", {
    fields: [
            {name: "id",             type: "int"},
        {name: "title",           type: "string"},
        {name: "bought",         type: "boolean"},
   ],
    proxy: {
        type: 'rest',
        url: '/lists',
        format: 'json',
        reader: {
            type: 'json',
            root: 'data',
            record: 'entry'
        }
    }
});

Two differences with what you've done:

1/ The record option of the reader tells ExtJS to look for nested records in the json. It tells it to look for:

data: [
    {
        entry: {
            id: 1,
            title: "Title 1",
            bought: true
        }
    }
]

instead of:

data: [
    {
        id: 1,
        title: "Title 1",
        bought: true
    }
]

An alternative to setting the record property on the reader would be to disable nested json in Rails, by dumping this into your application config:

config.active_record.include_root_in_json = true

2/ When returning a single record, the json output should be the same as a collection, except you only have one record.

The Sencha Touch and ExtJS 4 docs can be a bit sparse sometimes, I found dissecting the examples is the best way to learn.

HTH


I ran into a similar problem when submitting a single record instead of a store. Setting a writer object with the name of your record as rootProperty solves the issue.

writer: {
  type         : 'json',
  rootProperty : 'your_record'
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜