Rails宝典之七十四式:复杂表单Part2

本文介绍如何使用JavaScript和RJS技术实现在Rails应用中动态添加和删除表单域,通过具体的代码示例展示了如何构建交互式的任务添加功能。
这次来看看如何使用JavaScript和RJS来动态添加和删除表单域:

继续上次的例子,我们首先要在layout里引入Prototype.js
[code]
<%= javascript_include_tag :defaults %>
[/code]

然后是新建project的页面模板:
[code]
<div id="tasks">
<%= render :partial => 'task', :collection => @project.tasks %>
</div>
<p><%= add_task_link "Add a task"%></p>
[/code]

这里add_task_link是我们在projects_helper.rb里添加的一个helper方法:
[code]
def add_task_link(name)
link_to_function name do |page|
page.insert_html :bottom, :tasks, :partial => 'task', :object => Task.new
end
end
[/code]
这里用到RJS的insert_html

然后看看一个partial页面模板_task.rhtml:
[code]
<div class="task">
<% fields_for "project[task_attributes][]", task do |task_form| %>
<p>
Task: <%= task_form.text_field :name %>
<%= link_to_function "remove", "this.up('.task').remove()" %>
</p>
<% end %>
</div>
[/code]
这里用到Prototype.js里的up方法查找上一个class为task的div
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值