体验一中添加了一个最基本的支架和一个简单的数据迁移,实现了一个基本的增删改查的功能列表。体验二中要在次功能上继续丰满一下功能。实现如下效果:

在每个公司中都包含有不同的部门,按照体验一中的方法,添加一个部门的支架,一个数据迁移。实现部门的增删改查功能。部门的数据结果如下:

具体方式省略。

简单创建了支架而没有定制应用,它将难以使用,为了给一个公司添加部门,将会边的很麻烦。我们把我们希望的页面和支架生成的部门的页面比较一下:

Cid和Chargeuserid先不用做关联,手添即可,只是为了能够重新组织页面。

部门列表和创建部门的页面看起来和我们想要的页面上出现的内容非常相似,目标页面中间部分看起来像是作为列表,而末尾像创建部门页面。

接下来是今天要整理的内容:把一个页面的内容分解到几个文件里。

首先要理解三个概念:

(1) 布局:为一系列网页设定统一的外观,大多数会提供出现在每个页面顶部和底部的标准的HTML元素。

(2) 模板:模版是页面的主要内容,模版与动作相关联。

(3) 局部模板:一个模版会调用多个不同的局部模版来建立页面的主要内容,局部模版允许把一个复杂模版分解为多个更小的部分,允许把公共的内容分离出来,比如菜单和导航栏,局部模版可以被模版使用,它也可以被布局直接使用。

布局、模版、局部模板这三种嵌入式Ruby(ERB)文件组成一个网页。

创建添加部门表单的局部模板:

局部模板只是另外一种ERB文件,它包含着与模板相同的标签类型。此时的项目的views结构如下图:

通过拷贝app/views/departments/new.html并且另存为app/views/companies/_new_department.html.erb来创建局部模板。一个重要的事情就是局部模板以字符_开始,Rails通过字符_来区分页面模板和局部模板。

在模版中包含局部模版:

我们要在company的show.html.erb页面模版来把创建的局部模版包含在它的输出里,局部模板和模板一样,仅仅只是一段伪装成HTML样子的Ruby代码,通过一个render命令到company的页面中:

现在局部模板应该已经添加到company的页面中了,让我们看一下show.html.erb Company页面查看信息是否现实正确。现实内容如下:

感觉好奇怪,我们看一下app/views/departments/new.html、app/views/companies/_new_department.html.erb文件中的内容:

 <h1>New department</h1>

 <%= render 'form' %>

 <%= link_to 'Back', departments_path %>

看来问题出现在<%= render 'form' %>这个地方,这里是页面直接跳转到_form.html.erb页面。所以就会出现如上页面现实的问题。

下面将app/views/companies/_new_department.html.erb改为如下内容(从app/views/departments/_form.html.erb将里面的内容复制出来的信息,因为添加部门的页面同样是直接跳转到此页面)避免冲突问题:

 <%= form_for(@department) do |f| %>
<% if @department.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(@department.errors.count, "error") %> prohibited this department from being saved:</h2> <ul>
<% @department.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %> <div class="field">
<%= f.label :name %><br>
<%= f.text_field :name %>
</div>
<div class="field">
<%= f.label :cid %><br>
<%= f.text_field :cid %>
</div>
<div class="field">
<%= f.label :chargeuserid %><br>
<%= f.text_field :chargeuserid %>
</div>
<div class="field">
<%= f.label :desc %><br>
<%= f.text_area :desc %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>

下面再看浏览器请求的结果:

什么意思,又出错了,看来说是@department为空,可是在添加部门的页面这个是正常工作的啊,为什么呢?对比一下模板中的内容是一样的,问题在于@department变量,额,问题就是这个,原来的时候创建一个部门是由DepartmentsController控制的,此刻改为CompaniesController控制,在DepartmentController中调用create方法的时候调用如下代码:

   # POST /departments
# POST /departments.json
def create
@department = Department.new(department_params) respond_to do |format|
if @department.save
format.html { redirect_to @department, notice: 'Department was successfully created.' }
format.json { render action: 'show', status: :created, location: @department }
else
format.html { render action: 'new' }
format.json { render json: @department.errors, status: :unprocessable_entity }
end
end
end

@department = Department.new(department_params)原来在调用create的时候它本身给定义好了一个空的department的实例变量,知道问题,那么就来解决这个问题

我们需要将页面中的@department改为一个局部变量。

 <h1>New department</h1>

 <%= form_for(department) do |f| %>
<% if department.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(department.errors.count, "error") %> prohibited this department from being saved:</h2> <ul>
<% department.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %> <div class="field">
<%= f.label :name %><br>
<%= f.text_field :name %>
</div>
<div class="field">
<%= f.label :cid %><br>
<%= f.text_field :cid %>
</div>
<div class="field">
<%= f.label :chargeuserid %><br>
<%= f.text_field :chargeuserid %>
</div>
<div class="field">
<%= f.label :desc %><br>
<%= f.text_area :desc %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %> <%= link_to 'Back', departments_path %>

如何把局部变量传递给局部模板:

由于局部模板就像是函数,考虑到DepartmentController中给@departmentde可以所使用的值,由于表单会被用来初始化department,所以我们只要用一下方法给表单传递一个新的Department对象:

 <%= render :partial => "new_department", :locals=>{ :department => Department.new } %>

下面在看一下页面的结果:

工作正常,但是下面有两个Back,额,额,由于局部模板中的Back没有去掉,但是此时已经不需要从创建department到department列表了,此处就删掉吧。简单的很。

Ruby on rails初体验(二)的更多相关文章

  1. Ruby on rails初体验(一)

    接触ruby on rails 已经有一段时间了,想记录一下自己的rails历程.自己写一些小例子来帮助学习.  Rails 适用于那些以数据为中心的应用,很多应用的核心部分包括一个数据库,这些引用的 ...

  2. Ruby on rails初体验(三)

    继体验一和体验二中的内容,此节将体验二中最开始的目标来实现,体验二中已经将部门添加的部分添加到了公司的show页面,剩下的部分是将部门列表也添加到公司的显示页面,整体思路和体验二中相同,但是还是会有点 ...

  3. ruby on rails 实战(二)

    1,修改routes文件,让所有的action都可以使用get或者post方式访问 match "/:controller/:action" => "control ...

  4. 【原创】Jquery初体验二

    快速导航 一.传统方式生成Table 二.使用jquery.tmpl插件快速生成Table 三.Jquery中的操作class的几个方法 四:jq里面的克隆 五:属性过滤器 六:表单元素过滤器 一.传 ...

  5. Spring Cloud Alibaba 初体验(二) Nacos 服务注册与发现 + 集成 Spring Cloud Gateway

    一.服务注册 添加依赖: <dependency> <groupId>com.alibaba.cloud</groupId> <artifactId>s ...

  6. jquery.fn.extend与jquery.extend--(初体验二)

    1.jquery.extend(object); 为扩展jQuery类本身.为类添加新的方法. jquery.fn.extend(object);给jQuery对象添加方法. $.extend({ a ...

  7. JSON初体验(二):Gson解析

    今天,我们来介绍一下Gson的jar包的用法. JSON解析之Gson 特点:编码简介,谷歌官方推荐 数据之间的转换: 1.将json格式的字符串{}转换成为java对象 API: <T> ...

  8. node初体验(二)

    1.静态资源访问,需要设置路由和响应标头 2.url模块.path模块.querystring模块 Url { protocol: null, slashes: null, auth: null, h ...

  9. Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验

    Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验 相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出E ...

随机推荐

  1. loj2062 [HAOI2016]地图

    ref #include <algorithm> #include <iostream> #include <cstdio> #include <cmath& ...

  2. 【SCOI 2010】股票交易

    题目 最近 \(\text{lxhgww}\) 又迷上了投资股票,通过一段时间的观察和学习,他总结出了股票行情的一些规律. 通过一段时间的观察,\(\text{lxhgww}\) 预测到了未来 \(T ...

  3. Vue在tradingView遇到的问题

    K线图刷新或重新加载时闪白 首先需要了解的是,闪白是 iframe的机制 所以只要解决掉iframe就可以了 首先找到 charting_library.min.js 搜索 找到配置项 style=& ...

  4. [oldboy-django][2深入django]班级管理(Form)--编辑

    1.需求:编辑班级,难点:点击编辑按钮后,页面如何显示 待编辑 班级的信息(用Form实现), 以及Url 设置 2 url url(r'^edit_class/nid=(?P<nid>\ ...

  5. easyui datagrid 学习 (一)

    注意:当使用谷歌浏览器时!需要 设置style="overflow:hidden",这样则可以去掉滚动条!(该样式添加到layout上!) fit:属性 自动填父容器, borde ...

  6. mysql的下载及配置(复制1)

    ---恢复内容开始--- MySQL数据库安装与配置详解 目录 一.概述 二.MySQL安装 三.安装成功验证 四.NavicatforMySQL下载及使用 一.概述 MySQL版本:5.7.17 下 ...

  7. ALPHA(四)

    目录 组员情况 组员1(组长):胡绪佩 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:丹丹 组员7:何家伟 组员8:政演 组员9:鸿杰 组员10:刘一好 组员:何宇恒 展示组内最新 ...

  8. 【转】BehaviorDesigner学习

    BehaviorDesigner学习   行为树: 行为树设计师插件是一个专门为unity设计的AI插件. 通过继承Behavior中的Task下的四个节点,可以创建自己的行为树节点. 行为树中的自定 ...

  9. POJ 2286 The Rotation Game(IDA*)

    The Rotation Game Time Limit: 15000MS   Memory Limit: 150000K Total Submissions: 6396   Accepted: 21 ...

  10. Bridges

    Bridges 题目描述 YYD为了减肥,他来到了瘦海,这是一个巨大的海,海中有n个小岛,小岛之间有m座桥连接,两个小岛之间不会有两座桥,并且从一个小岛可以到另外任意一个小岛.现在YYD想骑单车从小岛 ...