【写给朱大虫的教程】【Ruby on Rails】【005】违背Rails理念的简单开始，下部

四、设计前台页面

目标：设计页面，new：添加user；create：创建user；login：用户登录；index：登录后页面；

实施：创建一个controller，包含new、create、login和index四个action

1、创建contrller

执行命令：

$ rails g  controller users new create login index

解释：

rails命令，不解释

g，不解释

controller，不解释

users，要创建的controller的名字，注意是复数

new、create、login、index都是action的名字

执行完这句命令后，看看都产生了那些变化：

app/controllers文件夹下多了一个users_controller.rb文件

users_controller.rb下面有new、create、login和index四个action

app/views文件夹下多了一个users文件夹

app/views/users文件夹下产生了四个文件new.html.erb、create.html.erb、login.html.erb和index.html.erb

app/config文件夹下的routes.rb文件中多了四行：get "users/new"、get "users/create"、get "users/login"和get "users/index"

2、添加新用户

（1）修改app/views/new.html.erb文件

<%= form_tag(users_create_path, :method => "post") do %>
<%= label_tag(:name, "Name:") %>
<%= text_field_tag(:name) %><br />
<%= label_tag(:password, "Password:") %>
<%= text_field_tag(:password) %><br />
<%= submit_tag("Create") %>
<% end %>

解释：

form_tag 会转换成html <form></form>，users_create_path也就是users/create

form_tag、lable_tag都是rails的一种写法，最后会转化成html，当然你也可以直接用html

转换成的html：

<form accept-charset="UTF-8" action="/users/create" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /><input name="authenticity_token" type="hidden" value="JEyhZgcAFJ8ZHEjiwkfzmGscA223xhADRcAX8EZPZBY=" /></div>
<label for="name">Name:</label>
<input id="name" name="name" type="text" /><br />
<label for="password">Password:</label>
<input id="password" name="password" type="text" /><br />
<input name="commit" type="submit" value="Create" />
</form>

（2）修改create

在config/routes.rb中将get "users/create"改为post "users/create"

在app/controllers/users_controller.rb中，修改create：

def create
u=User.new
u.name=params[:name].to_s
u.password=params[:password].to_s
f=u.save
if f
@info="OK!"
else
@info="ERROR!"
end
end　　

修改app/views/users/create.html.erb为：

<%= @info %>

（3）在浏览器中输入：http://localhost:3000/users/new



点击“Create”



查看数据库：



用户添加完毕！

3、用户登录

（1）修改app/views/users/login.html.erb文件

<%= form_tag(users_index_path, :method => "post") do %>
<%= label_tag(:name, "Name:") %>
<%= text_field_tag(:name) %><br />
<%= label_tag(:password, "Password:") %>
<%= text_field_tag(:password) %><br />
<%= submit_tag("Login") %>
<% end %>

（2）修改index

在config/routes.rb中将get "users/index"改为post "users/index"

在app/controllers/users_controller.rb中，修改index：

def index
u=User.find_by_name(params[:name].to_s)
if !u || u.password != params[:password].to_s
@info="ERROR!"
else
@info="OK!"
end
end

修改app/views/users/index.html.erb

<%= @info %>

（3）在浏览器中输入：http://localhost:3000/users/login



结果显示：



五、总结

到此为止，一个从后台数据库到前台页面的rails程序就写好了，当然本程序仅仅是为了讲解rails的运作机制，不具备任何实用价值。

望君再从头思考一遍！