資源描述：
《rails敏捷開發(fā)《2》》由會員上傳分享，免費在線閱讀，更多相關內容在教育資源-天天文庫。
1、~~9.2迭代D2：創(chuàng)建基于Ajax的購物車IterationD2：CreatinganAjax-BasedCartAjax允許我們通過編寫在瀏覽器中運行的代碼，來與服務器端的應用程序交互。在這里，我們希望讓AddtoCart按鈕在后臺調用服務器端的add_to_card方法，隨后服務器把關于購物車的HTML發(fā)回瀏覽器，我們只要把服務器更新的HTML片段替換到邊框里就行了。要實現這種效果，通常的做法是首先編寫在瀏覽器中運行的JavaScript代碼，然后編寫服務器端代碼與JavaScript交互(可能是通過JSON之類的技
2、術)。好消息是，只要使用Rails，這些東西都將被隱藏起來：我們使用Ruby(再借助一些Rails輔助方法)就可以完成所有功能。向應用程序中引入Ajax的技巧在于“小步前進”，所以我們先從最基本的開始：修改貨品列表頁，讓它向服務器端應用程序發(fā)起Ajax請求；應用程序則應答一段HTML代碼，其中展示了最新的購物車。在索引頁上，目前我們是用button_to()來創(chuàng)建“AddtoCart”鏈接的。揭開神秘的面紗，button_to()其實就生成了HTML的
這是一個標準的HTML表單，所以，當用戶點擊提交按鈕時，就會生成一個POST請求。我們不希望這樣，而是希望它發(fā)送一個Ajax請求。為此，必須更直接地編寫表單代碼——可以使用form_remote_tag
4、這個Rails輔助方法。“form_..._tag”這樣的名字代表它會生成HTML表單，“remote”則說明它會發(fā)起Ajax遠程調用?，F在，打開app/views/store目錄下的index.html.erb文件，將button_to()調用替換為下列代碼：depot_l/app/views/store/index.html.erb<%form_remote_tag:url=>{:action=>'add_to_cart',:id=>product}do%><%=submit_tag"AddtoCart"%><%end
5、%>用:url參數，你就可以告訴form_remote_tag()應該如何調用服務器端的應用程序。該參數接收一個hash，其中的值就跟傳遞給button_to()方法的參數一樣。在表單內部(也就是do和end之間的代碼塊中)，我們編寫了一個簡單的提交按鈕。在用戶看來，這個頁面就跟以前一模一樣。雖然現在處理的是視圖，但我們還需要對應用程序做些調整，讓它把Rails需要用到的JavaScript庫發(fā)送到用戶的瀏覽器上。在第24章“Web2.0”(第521頁)中，我們還會詳細討論這個話題；現在，我們只需在store布局的6、d>部分里調用javascript_include_tag方法即可。depot_l/app/views/layouts/store.html.erb
PragprogBooksOnlineStore<%=stylesheet_link_tag"depot",:media=>"all"%>→<%=javascript_include_tag:defaults%>~~~~~到目前為止，瀏覽器已經能夠向我們的應用程序發(fā)送Ajax請求，下一步就是讓應用程序做出應答。
7、我們打算創(chuàng)建一段HTML代碼來代表購物車，然后讓瀏覽器把這段HTM插入當前頁面的DOM文檔對象模型（DocumentObjectModel)。這是文檔結構和內容在瀏覽器中的內部表示，我們據此來改變顯示給用戶的東西。，替換掉當前顯示的購物車。為此，我們要做的第一個修改就是不再讓add_to_cart重定向到首頁。(我們知道，我們剛剛才加上這個功能，現在又要把它拿掉了……我們很敏捷，對吧？)我們調用respond_to()方法并告訴它我們要響應的是.js格式文件這條語句乍看起來有些奇怪，其實就是一個使用代碼塊作為參數的方法調用
8、。代碼塊在第A.9節(jié)“代碼塊與迭代器”中有介紹。在第12.1節(jié)“分別應答”中有更詳細的描述。。Downloaddepot_l/app/controllers/store_controller.rbdefadd_to_cartproduct=Product.find(params[:id])@cart=f
