Data in json ruby on rails and Extjs

Hi all,
I start to use ruby on rails with Extjs, in a controller i put this code
respond_to do |format|
format.html
format.ext_json { render :json =>
Collection.find(:all).to_ext_json(:class => Collection) }
end
and in view i put this code

<%= ext_datastore_for 'Collection' %> <% javascript_tag do -%> var collection_column_model = new Ext.grid.ColumnModel([ {id: 'id', header: "#", width: 20, dataIndex: 'id'}, {header: 'name', dataIndex: 'collection[name]'}, {header: 'description', dataIndex: 'collection[description]'} ]); <% end -%> <%= ext_grid_for 'Collection', :element => 'collection-grid' %>

in the browser i have grid but without data.
any one can help me for this.
Thank’s

Markror2009 Markror2009 wrote:

Hi all,
I start to use ruby on rails with Extjs, in a controller i put this code
respond_to do |format|
format.html
format.ext_json { render :json =>
Collection.find(:all).to_ext_json(:class => Collection) }
end
and in view i put this code

<%= ext_datastore_for 'Collection' %> <% javascript_tag do -%> var collection_column_model = new Ext.grid.ColumnModel([ {id: 'id', header: "#", width: 20, dataIndex: 'id'}, {header: 'name', dataIndex: 'collection[name]'}, {header: 'description', dataIndex: 'collection[description]'} ]); <% end -%> <%= ext_grid_for 'Collection', :element => 'collection-grid' %>

in the browser i have grid but without data.
any one can help me for this.
Thank’s

I write this mini-tutorial to you:
We will using the convencional way.

Requirements: nifty-generators (install using gem install
nifty-generators)

  1. Create the application: rails contacts
  2. Create the database: rake db:create
  3. Create layout using nifty_layout: script/generate nifty_layout
  4. Create our Contact using nifty_scaffold: script/generate
    nifty_scaffold name:string phone:string email:string
  5. Create the table contacts: rake db:migrate

In config/initializers/new_rails_defaults.rb change following:

ActiveRecord::Base.include_root_in_json = true

To

ActiveRecord::Base.include_root_in_json = false

Open your layout in app/views/layout/application.html.erb and add the
follow:

<%= stylesheet_link_tag '/ext/resources/css/ext-all' %>
<%= javascript_include_tag '/ext/adapter/ext/ext-base' %>
<%= javascript_include_tag '/ext/ext-all' %>

I’m assume your ext folder is in public.

Now open your contacts_controller and change the action index to:

def index
@contacts = Contact.all

respond_to do |format|
format.html
format.json { render :json => @contacts.to_json }
end
end

Open the app/views/contacts/index.html.erb and change to:

function index(){ var store = new Ext.data.JsonStore({ url: '/contacts.json', id: 'store', idProperty: 'id', fields: [ 'id', 'name', 'email', 'phone'] });
store.load();

var grid = new Ext.grid.GridPanel({
  title: 'Contacts',
  width: 400,
  height: 300,
  frame: true,
  renderTo: 'grid',
  store: store,
  columns: [
    { header: 'NAME', dataIndex: 'name', sortable: true },
    { header: 'EMAIL', dataIndex: 'email', sortable: true },
    { header: 'PHONE', dataIndex: 'phone', sortable: true }
  ]
});

}

Ext.onReady(index());
</script

Run your server by script/server and fun.

Atc.,
Kirk Patrick