Topic: UI Layout Help

Hi,

How do you create frames using Ruby ? How do you write your controllers for the same ?..I am basically a designer not a programmer, so this is new to me. I have beeing with tutorialpost and walked through the Library application. But I am very confused with creating a page of my own.

Could someone tell me how to use controllers/views/layouts for a proper website ?...with lots of images,divs and content. I understand that styling is through CSS, am just getting to understand the nooks and corners of Ruby, so please show me some code of a working application or some good pointers that can help me get started.



Vj

Re: UI Layout Help

Hi,

Well a Rails application consists of models, views, and controllers of course. Models are what things reference to so to speak, and is also the portion of the app that communicates with databases. The view is what everyone sees on the "outside". And the controller, is what contains your logic to make things happen in the view.

Now, when you create a rails app, if you generate a scaffold, it will create the model, view, and controller for you, and then you just have to edit it.

So an example would be you are a store, and you what to show what products you offer. So you'd want to create a product scaffold

script/generate scaffold product

Now since your products will be stored in a database, you'd want to edit your migration, which is what deals with the database structure. So let's just say we want a product name, description, price, and a link for them to buy it. So I'd go to db/migrate, and find that xxxxxxxxxx.rb file in there, and edit it:
Migration << ActiveRecord :: Base

Self.up
  create_table products do |t|
  t.string :name
  t.text :desc
  t.string :buy_now
end

Self.down
  remove_table :products
end


I wasn't actually looking at a rails app, so I'm sure I had something wrong in the base of whats shown in a real migration, but that's the basic gist of it.

Ok, so now we want to look at our controller, located in app/controllers/product_controller.rb. You see you have multiple actions in there; index, show, new, create, etc...

We want to edit our new page, for creating new products. So we open app/views/products/new.html.erb, and add some lines to show fields for entering a new product record to the database.

<% form_for @product do |f| %>
<%= f.error_messages %>
<p>Product Name<br />
   <%= f.text_field :name %>
</p>
<p>Product Description <br />
  <%= f.text_area :desc, :cols => "26", :rows => "10" %>
</p>
<p>Buy Now URL<br />
  <%= f.text_field :buy_now %>
</p>
<%= f.submit_tag "Submit" %>
<% end %>

And then in your index action, app/views/products/index.html.erb, you'd have some code to run queries against the database.

<% for @product each do |product| %>
<table>
<tr>
   <th>Name</th>
   <th>Description</th>
   <th>Link</th>
</tr>
<tr class="<%= cycle('even', 'odd') %>">
   <td><%= product.name %></td>
   <td><%= product.desc %></td>
   <td><a href="<%= product.buy_now>">Buy Now</a></td>
</tr>
</table>
<% end %>

Now again, some of that may not be exact, as I don't have a rails app in front of me at the moment, but that is basically what you'd do. Then they are able to see your product line when they go to http://example.com/products.

That is a scenario of a real world app, but may not be totally exact. tongue

Hope that helps.