六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 112|回复: 0

ruby on rails(9) -

[复制链接]

升级  34%

29

主题

29

主题

29

主题

秀才

Rank: 2

积分
101
 楼主| 发表于 2013-2-7 19:19:37 | 显示全部楼层 |阅读模式
火热的Ajax啊,全世界的程序员都在讨论它(c,c++请飘过),终于我要开始学习啦。
    首先是代码重用,rails为了使逻辑和表现分开,采取了一些列的方法,其中之一是,不要把逻辑写在表现页面上。因为,我们要分离拉。局部的代码,就采用partical。如<%= render(:partial =>"cart_item", :collection => cart.items)%>,:partial 的参数所对应的页面就是在参数名前加_.因此对应的页面为_cart_item.html.erb.
   修改add_to_cart.html.erb
  <table> <%= render(:partial => "cart_item",:collection => @cart.items)%>   <tr class="total-line">    <td colspan="2">Total</td>    <td class="total-cell"><%= number_to_currency(@cart.total_price) %></td>  </tr></table>  
  由于:partial 所指的为cart_item.因此,编写页面_cart_item.html.erb,:collection嘛意思么
   
   _cart_item.html.erb
    <tr>     <td><%=h cart_item.quantity %>×</td>     <td><%=h cart_item.title%></td>     <td class="item-price"><%= number_to_currency(cart_item.price)%>  </tr>  
  里面的变量名和:partial参数一致
  同理,修改layout/store_html.erb页面
    <div id="side">   <div id="cart"><%= render (:partial => "cart",:object => @cart)%>   </div>  
  bject又是嘛意思么,这些个参数,刷新@cart?
   然后编写 _cart.html.erb ,用于计算total_price
      <div class="cart-title">Your Cart</div>   <table><%= render(:partial =>"cart_item", :collection => cart.items)%><tr class="total-line"><td colspan="2">Total</td><td class="total-cell"><%= number_to_currency(cart.total_price)%></td></tr></table><%=button_to "Empty Cart", :action =>:empty_cart%>   
    @cart未定义,所以在store_controller里面
           def index  @products = Product.find_products_for_sale  @cart = find_cart      end     
    然后修改css亦即重定向。即可看到购物车在左边,原来的废掉了。css使购物车放右边,就是平时网页上的购物车了。
  ps:partial 如果对应的逻辑页面多,能否写到一个上去,或者有什么方法便于管理多个逻辑页面,不能就这么放在view下吧

   接下来是正题,ajax
   首先引入rails的js包,layout/store_controller.html.erb导入  <%= javascript_include_tag :defaults%>
   然后删除index.html.erb <%=button_to ... %>,改为
    <%form_remote_tag :url => {:action => :add_to_cart,:id => product}   do%>  <%= submit_tag "Add to Cart"%>  <%end%>  
  form...tag ,表示要用<form>,remote表示远程调用Ajax。url 服务程序调用地址 do,end form基本格式
   然后修改add_to_cart action 如下
      else  @cart = find_cart  @cart.add_product(product)  respond_to{|format| format.js}    end   
   repond_to 根据不同的格式类型采取不同的处理方式。客户端发送给浏览器式,头部Accept-Type: text/xml,指明格式,浏览器根据这个,采取不同的处理方式,未指明,默认text/html。
   format.js指向index.rjs
   然后编辑view/store/add_to_action.js.rjs。为什么在这个目录?
   page.replace_html("cart",:partial => "cart",bject => @cart)
   page,js产生器,page_html()取代
<div id="cart">
<%= render (:partial => "cart",:object => @cart)%>
</div>
参数必须一致
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表