通过js实现删除功能 ruby on rails
2015-10-27 18:02
579 查看
(1)首先给删除按钮增加一个属性 remote: true,这样ujs将这个click动作转化为ajax调用,
app/views/products/_product.html.erb
(2)在controller的destory方法里,增加接收js的请求代码
(3)新增文件app/views/products/destroy.js.erb,用的是fadeout方法,会渐变的将这一行隐藏掉。
app/views/products/_product.html.erb
<tr id="product_<%= product.id %>"> <td><%= link_to product.id, product_path(product) %></td> <td id="product_<%= product.id %>_name"><%= product.name %></td> <td id="product_<%= product.id %>_price"><%= number_to_currency product.price, unit: "¥" %></td> <td id="product_<%= product.id %>_description"><%= product.description %></td> <td><%=l product.created_at %></td> <td> <%= link_to t('.edit', :default => t("helpers.links.edit")), edit_product_path(product), :class => 'btn btn-default btn-xs editProductLink', remote: true, data: {type: 'json'} %> <%= link_to t('.destroy', :default => t("helpers.links.destroy")), product, :remote => true, :method => :delete, :data => { :confirm => t('.confirm', :default => t("helpers.links.confirm", :default => 'Are you sure?')) }, :class => 'btn btn-xs btn-danger' %> </td> </tr>
(2)在controller的destory方法里,增加接收js的请求代码
def destroy @product.destroy respond_to do |format| format.html { redirect_to products_url, notice: 'Product was successfully destroyed.' } format.json { head :no_content } format.js end end
(3)新增文件app/views/products/destroy.js.erb,用的是fadeout方法,会渐变的将这一行隐藏掉。
$('#product_<%= @product.id %>').fadeOut();
相关文章推荐
- 通过弹出层实现新建功能 ruby on rails
- 通过弹出层实现新建功能 ruby on rails
- 如何避免新建的时候点击按钮重复提交ruby on rails
- 如何避免新建的时候点击按钮重复提交ruby on rails
- 如何在Mac上用Ruby封装C/C++接口
- DIY Ruby CPU 分析 Part II
- DIY Ruby CPU 分析 Part II
- ruby环境的安装
- how to update ruby
- 为应用增加登录注册功能 ruby on rails
- 为应用增加登录功能 ruby on rails
- 在index页面显示人民币货币符号-ruby on rails
- 在index页面显示人民币货币符号-ruby on rails
- Ruby Gem命令
- 使用Ruby On Rails15分钟打造一个博客系统
- ruby基础总结(一)
- Ruby 交互式编程工具——irb
- 如何让新建的ruby on rails 项目打开直接时网页,显示Hello,Word,
- 如何在Mac OS X上安装 Ruby运行环境
- ruby gem管理