ROR新手上路之五用户注册

最新推荐文章于 2024-05-03 09:35:09 发布

weixin_30338481

最新推荐文章于 2024-05-03 09:35:09 发布

阅读量121

点赞数

文章标签： xhtml ruby

原文链接：http://www.cnblogs.com/lonelystarxing/articles/1880729.html

版权

继续学习ROR，以下是我对《RailsSpace Web应用开发》书上的相关实例学习。

其实写一个用户注册页面还是比较简单，只需创建一个register操作，添加默认index，然后编辑register.rhtml文件即可

>ruby script/generate controller User index register --创建register 其包括一些验证在下面记录

在app/views/user/register.rhtmlz中添加如下代码

<h2>Register</h2>
<% form_for :user do |form| %>
<fieldset>
  <legend>
    Enter Your Drtails
  </legend>
  <%= error_messages_for "user" %>
  <div class="form_row">
  <label for="screen_name">Screen name:</label>
  <%= form.text_field :screen_name, :size=>User::SCREEN_NAME_SIZE,  :maxlength=>User::SCREEN_NAME_MAX_LENGTH %>
  </div>
  <div class="form_row">
  <label for="email">Email:</label>
  <%= form.text_field :email, :size=>User::EMAIL_SIZE,  :maxlength=>User::EMAIL_MAX_LENGTH %>
  </div>
  <div class="form_row">
  <label for="password">Password:</label>
  <%= form.text_field :password,  :size=>User::PASSWORD_SIZE,  :maxlength=>User::PASSWORD_MAX_LENGTH %>
  </div>
  <div class="form_row">
  <%= submit_tag "Rsgister!", :class=>"submit" %>
  </div>
</fieldset>
<% end %>

然后在app/model/user.rb中添加如下代码

  #视图显示的文本框的大小
  SCREEN_NAME_SIZE=20
  PASSWORD_SIZE=10
  EMAIL_SIZE=30

设置默认index，将layouts/site.rhtml改名为application.rhtml设置默认layout文件，在app/controller/user_controller.rb中设置成

class UserController < ApplicationController
  layout "application"
  def index
    @title="RailsSpace User Hub"
  end

  def register
    @title="Register"
    if request.post? and params[:user]
      #logger.info params[:user].inspact 使用Ruby的logger函数，在开发日志文件中可以查询输出的信息！
      #rails params[:user].inspact #将页面输出到浏览器中，其内容作为一个异常被触发
      @user=User.new(params[:user])
      if @user.save
        flash[:notice]="User #{@user.screen_name} created!"
        redirect_to :action=>"index"
#        render  :text=>"User created!"
      end
    end
  end
end

减少导航链接中的重复代码，先设置app/helpers/application_helper.rb

def nav_link(text,controller,action="index")
#return可省略，符合rails习惯
return link_to_unless_current text, :controller=>controller, :action=>action
end

然后设置app/views/layouts/application.rhtml,代码清单如下

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/DTDT/xhtml1-strict.dtd">
<html>
  <head>
    <title><%=@title %></title>
    <%=stylesheet_link_tag "site"%>
  </head>
  <body>
    <div id="whole_page">
      <div id="header">RailsSpace</div>
      <div id="nav">
        <%=nav_link "Home","site"%>|
        <%=nav_link "About Us","site","about"%>|
        <%=nav_link "Help","site","help"%>|
        <%=nav_link "Register","user","register"%>
        <%#= link_to_unless_current("Home",{:action=>"index",:controller=>"site"}) %>
        <%#= link_to_unless_current("About US",{:action=>"about",:controller=>"site"}) %>
        <%#= link_to_unless_current("Help",{:action=>"help",:controller=>"site"}) %>
        <%#= link_to_unless_current("Register",{:action=>"register",:controller=>"user"}) %>
        <%#*函数调用的圆括号是可选的，花括号作为最后一个参数时也是可选的,nav_link替换link_to_unless_current，在application_helper.rb中声明%>
      </div>
      <div id="content">
        <% if flash[  :notice] -%>
        <div id="notice"><%=flash[:notice]%></div>
        <%end -%>
        <%=yield%>
        <%#*函数调用的圆括号是可选的，花括号作为最后一个参数时也是可选的%>
        <%#=@content_for_layout%>
      </div>
      <% if ENV["RAILS_ENV"]=="development" %>
        <%= debug(params)%>
      <% end  %>
    </div>
  </body>
</html>

此时我们可以通过http://localhost:3000/site/register来访问注册界面，当然页面美观方面可能不是让自己很满意，那就在public/stylesheets/dite.css中设置样式，参考书籍中的代码如下

代码

/*
Document : site
Created on : 2010-11-9, 11:09:56
Author : Administrator
Description:
Purpose of the stylesheet follows.
*/

/*
TODO customize this sample style
Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

root {
display : block ;
}
body {
font-family : sans-serif ;
background : gray ;
margin : 0 ;
text-align : center ;
}
/* 使IE正确显示fieldset/legend */
html fieldset {
position : relative ;
margin-top : 1em ;
padding-top : 2em ;
padding-bottom : 2em ;
}
html legend {
position : absolute ;
top : -1em ;
left : .5em ;
}
/* 表单styles */
fieldset {
background : #ddd ;
}
legend {
color : white ;
background : maroon ;
padding : .4em 1em ;
}
label {
width : 10em ;
float : left ;
text-align : right ;
margin-right : .2em ;
display : block ;
}
.form_row {
white-space : nowrap ;
padding-bottom : .5em ;
}
.submit {
margin-left : 12em ;
}
#whole_page {
width : 50em ;
margin : auto ;
padding : 0 ;
text-align : left ;
border-width : 0 1px 1px 1px ;
border-color : black ;
border-style : solid ;
}
#header {
color : white ;
background : maroon ;
font-size : 24pt ;
padding : 0.25em ;
margin-bottom : 0 ;
}
#nav {
color : black ;
font-size : 12pt ;
font-weight : bold ;
background : #ccc ;
padding : 0.5em ;
}
#nav a,#nav a:visited {
color : maroon ;
text-decoration : none ;
}
#nav a:hover {
border-bottom : 2px dotted maroon ;
}
#content {
height : 100% ;
background : white ;
padding : 1em ;
}
#content h1 {
font-size : 18pt ;
}
/* 调试信息的样式 */
.debug_dump {
text-align : left ;
border-top : 1px dashed black ;
background : #ccc ;
margin : 0 ;
padding : 0.5em ;
}
/* 错误报告的样式 */
.fieldWithErrors {
margin : 2px ;
padding : 2px ;
background-color : red ;
display : table ;
}
#errorExplanation {
border : 2px solid red ;
padding : 7px ;
padding-bottom : 12px ;
margin-bottom : 20px ;
background-color : #f0f0f0 ;
}
#errorExplanation h2 {
text-align : left ;
font-weight : bold ;
padding : 5px 5px 5px 15px ;
font-size : 15pt ;
margin : -7px ;
background-color : #c00 ;
color : #fff ;
}
#errorExplanation p {
color : #333 ;
margin-bottom : 0 ;
padding : 5px ;
}
#errorExplanation ul li {
font-size : 11pt ;
list-style : square ;
}
/* Flash notice 样式 */
#notice {
border : 1px solid green ;
padding : 1em ;
margin : 1em ;
margin-bottom : 2em ;
background-color : lightgray ;
font : bold smaller sans-serif ;
}

注意：需要关注多种浏览器之间对css的不同解释。

最后需要补充点的是可以设置下user/index.rhtml的内容。最后的显示页面如图所示（我使用ff浏览器接却的图片）

转载于:https://www.cnblogs.com/lonelystarxing/articles/1880729.html

weixin_30338481

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ROR新手上路之五用户注册

继续学习ROR，以下是我对《RailsSpace Web应用开发》书上的相关实例学习。其实写一个用户注册页面还是比较简单，只需创建一个register操作，添加默认index，然后编辑register.rhtml文件即可>ruby script/generate controller User index register --创建register 其包括一些验证在下面记录在...
复制链接

扫一扫