Ruby学习笔记5: 动态web app的建立 （2）

上一节里，我们搭建了一个数据库的结构，并用index验证了request-response cycle，如下图：

1. Add show method into Controller

这一节，我们要继续丰富我们的controller:
While index gave all categories, show allows us to access one category. This this is helpful when we want to show just one Category at a time in our Etsy app.

The show method works like this. we write:

def show
  @category = Category.find(params[:id])    #it's a hash that we use to find an object by its unique id
end

The show method finds a single category of a given id and stores it in @category. Look a little closer at params[:id]. Seem familiar?
It's a hash that we use to find an object by its unique id. We can find the exact object we want.
我们知道，【在main Controller里的每个action都需要一个route & view】
这里我们在controller里加入了show method，Rails自动update了the route and the view for us.

提醒：在route.rb文件中，我们已有的语句：resources :categories已经takes care of our route for show. Rails 还创建了show.html.erb在我们的Views中!
Rails did this for show, just like it did for the index method.

Rails generates these when we enter methods in your rails generate controller command[rails generate controller Categories index show new edit delete], other we need do it manually.

此时我们的routes.rb还是老样子：

Rails.application.routes.draw do
  get '/' => 'pages#home'

  resources :categories
  get 'categories/:id/delete' => 'categories#delete', :as => :categories_delete
end

**show.html.erb:

<%= render 'shared/topnav' %>
<p>
  <strong>Name:</strong>
  <%= @category.name %>
</p>

<p>
  <strong>Thumburl:</strong>
  <%= image_tag @category.thumburl %>
</p>

<%= link_to 'Edit', edit_category_path(@category) %> |
<%= link_to 'Back', categories_path %>

<%= render 'shared/footer' %>

**request in browser: http://localhost:8000/categories/1
we get:

我们再请求一些url如： localhost:8000/categories/2 能得到对应的改变。

这里我就有个疑问，为何routes.rb文件里没有体现出任何对 url 请求的处理的代码，比如，它怎么区分 /categories 和 /categories/1 这俩请求的

2. Forms in html - 表单请求

在我们开始下一个method之前，先看看form - 表单。
Forms are used all over the internet to get input from users. Anytime you fill in information online - signing up for a website or buying shoes, you use a form.
>>Rails gives us a way to create forms called form_for . Let's take a look:

 <%= form_for (@category) do |f| %>  <!--for the person at hand, we'll pass the following information to our form.-->
   <div class="field">  
   <%= f.label :name %><br>   <!--Heading for name, labels in Rails, allow us to label our field -!--冒号后面不能有空格--->
   <%= f.text_field :name %>  <!--The field where we put our stuff, text_field is for text, -->
   </div>

   <div class="field">
   <%= f.label :thumburl %><br>
   <%= f.url_field :thumburl %>  <!--rails we can use url_field for things like urls-->
   </div>

   <div class='actions'>
   <%= f.submit %> <!--the button to submit the form.-->
   </div>
 <% end %>

All this information gets saved in a file called _form.html.erb[_form.html.erb]!

===================================

好了，我们要接着写 增加 的Controller methods 了。

3. Add 'new' and 'create' method into Controller

增加一个条目的method是成对出现的： new  & create
the 'new' method look like this:

def new
    @category = Category.new  #creating a whole new instance of Category, and storing it in @category
end

但是建立了一个instance of Category还不够，它并没有保存，需要建立'create' method.

The create method looks like this:

def create
 @category = Category.new(category_params)  #save that information as our new data through our strong params method
 if @category.save
  redirect_to(:action => 'index') #If it saves, we redirect to the index page
 else
  render('new') #otherwise the new page will render again.
 end
end

此时的 *** app/controllers/categories_controller.rb 文件就成了：

class CategoriesController < ApplicationController
  def index
    @categories = Category.all
  end

  def show
  	@category = Category.find(params[:id])
  end

  def new
  	@category = Category.new
  end
  
  def create
  	@category = Category.new(category_params)  # I do not udrstand the .new and the ()
  	if @category.save
  		redirect_to(:action => 'index')
  	else
  		render('new')
  	end
  end

  def edit
  end

  def delete
  end
  
  private
  def category_params
  	params.require(:category).permit(:name, :thumburl)
  end

end

在浏览器中请求：localhost:8000/categories/new, 我们得到：


>>> 接着我们就来编辑这个 app/views/categories/new.html.erb 文件，我们使用引用 _form.html.erb 的方式，直接一句语句引用过来:

<%= render 'form' %>

so,new.html.erb 文件里：

<%= render 'shared/topnav' %>

<h1>New Category</h1>

<!-- Render form here -->
<%= render 'form' %>

<%= link_to 'Back', categories_path %>

<%= render 'shared/footer' %>

然后我们就得到了这个：

===================================

好了，我们要接着写 改 的Controller methods 了。

4. Add 'edit' and 'update' method into Controller

修改一个条目的method是成对出现的： edit  & update
Edit and Update methods are also related. The edit method will give us the ability to edit information and the update method will save the information we edit!

The edit method looks like this:

def edit
  @category = Category.find(params[:id])
end

edit method 就是根据id找到category并把它存入@category中。跟show method是一模一样的。这还不够，我们还要一个update method来存它。

def update
  @category = Category.find(params[:id])  #find a category by its id
  if @category.update_attributes(category_params)
    redirect_to(:action => 'show', :id => @category.id)
  else
    render('index')
  end
end

所以此时我们的**app/controllers/categories_controller.rb文件就成了：

class CategoriesController < ApplicationController
  def index
    @categories = Category.all
  end

  def show
  	@category = Category.find(params[:id])
  end

  def new
  	@category = Category.new
  end
  
  def create
  	@category = Category.new(category_params)
  	if @category.save
  		redirect_to(:action => 'index')
  	else
  		render('new')
  	end
  end

  def edit
  	@category = Category.find(params[:id]) #finds a single category of a given id and stores it in @category
  end
  
  def update
  	@category = Category.find(params[:id]) #finds a person by its id and stores it in person
  	if @category.update_attributes(category_params)#check if the attributes are updated in our model
  		redirect_to(:action => 'show', :id => @category.id)#go to show page for that object
  	else
  		render('index') #render our index again
  	end
  end

  def delete
  end
  
  private  
 	def category_params
  	params.require(:category).permit(:name, :thumburl)
  end
  	
end

In your browser, visit localhost:8000/categories/1/edit to see what you created.

接下来是修改view: app/views/categories/edit.html.erb
We just need an edit page and the update page will process the information.
Here, our form_for comes in handy again. We go to our edit page and write: <%= render 'form' %>
That's it. We're good!

<%= render 'shared/topnav' %>

<h1>Edit Category</h1>

<!-- Render form here -->
<%= render 'form' %>

<%= link_to 'Back', categories_path %>

<%= render 'shared/footer' %>

浏览器请求：http://localhost:8000/categories/1/edit

===================================

好了，我们要接着写 删 的Controller methods 了。

5. Add 'delete' and 'destroy' method into Controller

delete and destroy method.The delete and destroy methods go together. The delete method will give us the ability delete information, and the destroy method will permanently destroy it! The 'delete' method 是我们可以拿来删除信息的，the 'destroy' method是让我们永久去除它的。

we could write a delete method like this:

def delete
  @category = Category.find(params[:id])
end

它看起来有点像show & edit，The destroy method looks like this:

def destroy
  Category.find(params[:id]).destroy 
  redirect_to(:action => 'index')
end

Here we find a category we want to permanently delete. Once we delete it, we get redirected to the index page.

修改view： app/views/categories/delete.html.erb 成：

<p>
  <strong>Name:</strong>
  <%= @category.name %>
</p>

<p>
  <strong>Thumburl:</strong>
  <%= image_tag @category.thumburl %>
</p>

<%= link_to "Delete", categories_delete_path(:id => @category.id) %> |
<%= link_to 'Edit', edit_category_path(@category) %> |
<%= link_to 'Back', categories_path %>

<p>1</p>
<p>2</p>
<p>3</p>

然后浏览器中请求：localhost:8000/categories/1/delete, 得到：

Congratulations! You created the Categories page of the Etsy app. We did this by creating the Model, Controller, and Views for Categories.

总结一下：

We first generated the Category Model using a terminal command. We added columns to our Categories Migration table and migrated and seeded our database.

We then generated a Categories Controller with the index, show, new, edit, and delete methods. This gave us a route and View for those methods.

We created Controller methods for eight of our CRUD actions, and Views for index, show, new, edit, and delete.

• 首先在terminal command里建立了Model， 我们在注入表里加入了columns到Categories,并且，我们Seeded our database.
  
• 然后我们建立了categories controller with the index, show, new, edit, and delete methods. 这让我们有了routes 和 view for those methods.
• 我们8个CRUD actions 所需的methods都建立在了controller里，index, show, edit ,and delete所需的Views也建立了。