ผลต่างระหว่างรุ่นของ "418342 ภาคปลาย 2552/ปฏิบัติการที่ 11"
Cardcaptor (คุย | มีส่วนร่วม) (หน้าที่ถูกสร้างด้วย 'ในปฏิบัติการนี้เราจะใช้ AJAX ในการทำ autocomplete ซึ่งหมายถ…') |
|||
| (ไม่แสดง 14 รุ่นระหว่างกลางโดยผู้ใช้ 4 คน) | |||
| แถว 1: | แถว 1: | ||
ในปฏิบัติการนี้เราจะใช้ AJAX ในการทำ autocomplete ซึ่งหมายถึงตอนที่มีการพิมพ๋ข้อความในฟอร์ม ตัวเวบแอพพลิเคชันช่วยเลือกคำที่เราต้องการพิมพ์ให้ | ในปฏิบัติการนี้เราจะใช้ AJAX ในการทำ autocomplete ซึ่งหมายถึงตอนที่มีการพิมพ๋ข้อความในฟอร์ม ตัวเวบแอพพลิเคชันช่วยเลือกคำที่เราต้องการพิมพ์ให้ | ||
| − | == | + | Walking in the presence of giants here. Cool thiiknng all around! |
| − | + | ||
| − | > | + | Which came first, the problem or the solution? Luckily it doesn't mttaer. |
| − | > | + | |
| − | + | == สร้างหน้า Search == | |
| − | + | ต่อไปเราจะทำการสร้างหน้าสำหรับให้ผู้ใช้คนหาสินค้า อันดับแรกให้เพิ่มเมธอด search ใน ProductController | |
| + | |||
| + | <geshi lang="rails"> | ||
| + | # GET /products/search?product[name]=abc | ||
| + | # POST /products/search?product[name]=abc | ||
| + | def search | ||
| + | if not params[:product].blank? and not params[:product][:name].blank? | ||
| + | @product = Product.find_by_name(params[:product][:name]) | ||
| + | respond_to do |format| | ||
| + | if @product | ||
| + | flash[:notice] = "Product found!" | ||
| + | format.html { redirect_to(@product) } | ||
| + | format.xml { render :xml => @product } | ||
| + | else | ||
| + | format.html { flash[:notice] = "<font color=red>Product not found!</font>" } | ||
| + | format.xml { render :xml => @product.errors, :status => :unprocessable_entity } | ||
| + | end | ||
| + | end | ||
| + | end | ||
| + | end | ||
| + | </geshi> | ||
| + | |||
| + | แล้วเราจึงสร้างหน้าเวบของมัน | ||
| + | |||
| + | <geshi lang="rhtml"> | ||
| + | <h1>Search Product</h1> | ||
| + | <% form_tag do %> | ||
| + | <p> | ||
| + | <b>Name:</b> | ||
| + | <%= text_field_tag :name %> | ||
| + | </p> | ||
| + | <%= submit_tag "Search" %> | ||
| + | <% end %> | ||
| + | </geshi> | ||
| + | |||
| + | หลังจากนั้นไปแก้ config/routes.rb ให้มัน route ไปหาหน้า search ได้ | ||
| + | |||
| + | <geshi lang="rails"> | ||
| + | ActionController::Routing::Routes.draw do |map| | ||
| + | map.resources :products, :collection=>{ | ||
| + | :auto_complete_for_product_name=>:get, | ||
| + | :search=>[:get,:post]} | ||
| + | |||
| + | ... | ||
| + | |||
| + | end | ||
| + | </geshi> | ||
| + | |||
| + | หลังจากทำขั้นนี้เสร็จแล้ว เมื่อเราพิมพ์ข้อความลงใน text box ของหน้า search หากข้อความนั้นตรงกับชื่อของสินค้าสักชิ้น เราก็จะได้ดูรายละเอียดของสิ้นค้าชิ้นนั้น แต่ถ้าไม่ตรงแม้แต่ตัวอักษรเดียว เราก็จะกลับมาที่หน้า search เหมือนเก่า | ||
| + | |||
| + | Play informative for me, Mr. inretent writer. | ||
| + | |||
| + | == การทำ autocomplete ในกรณีที่มีความซับซ้อนมากยิ่งขึ้น == | ||
| + | ให้ดู http://railscasts.com/episodes/102-auto-complete-association | ||
รุ่นแก้ไขปัจจุบันเมื่อ 03:46, 1 ตุลาคม 2554
ในปฏิบัติการนี้เราจะใช้ AJAX ในการทำ autocomplete ซึ่งหมายถึงตอนที่มีการพิมพ๋ข้อความในฟอร์ม ตัวเวบแอพพลิเคชันช่วยเลือกคำที่เราต้องการพิมพ์ให้
Walking in the presence of giants here. Cool thiiknng all around!
Which came first, the problem or the solution? Luckily it doesn't mttaer.
สร้างหน้า Search
ต่อไปเราจะทำการสร้างหน้าสำหรับให้ผู้ใช้คนหาสินค้า อันดับแรกให้เพิ่มเมธอด search ใน ProductController
<geshi lang="rails">
# GET /products/search?product[name]=abc
# POST /products/search?product[name]=abc
def search
if not params[:product].blank? and not params[:product][:name].blank?
@product = Product.find_by_name(params[:product][:name])
respond_to do |format|
if @product
flash[:notice] = "Product found!"
format.html { redirect_to(@product) }
format.xml { render :xml => @product }
else
format.html { flash[:notice] = "Product not found!" }
format.xml { render :xml => @product.errors, :status => :unprocessable_entity }
end
end
end
end
</geshi>
แล้วเราจึงสร้างหน้าเวบของมัน
<geshi lang="rhtml">
Search Product
<% form_tag do %>
Name: <%= text_field_tag :name %>
<%= submit_tag "Search" %>
<% end %> </geshi>
หลังจากนั้นไปแก้ config/routes.rb ให้มัน route ไปหาหน้า search ได้
<geshi lang="rails"> ActionController::Routing::Routes.draw do |map|
map.resources :products, :collection=>{
:auto_complete_for_product_name=>:get,
:search=>[:get,:post]}
...
end </geshi>
หลังจากทำขั้นนี้เสร็จแล้ว เมื่อเราพิมพ์ข้อความลงใน text box ของหน้า search หากข้อความนั้นตรงกับชื่อของสินค้าสักชิ้น เราก็จะได้ดูรายละเอียดของสิ้นค้าชิ้นนั้น แต่ถ้าไม่ตรงแม้แต่ตัวอักษรเดียว เราก็จะกลับมาที่หน้า search เหมือนเก่า
Play informative for me, Mr. inretent writer.
การทำ autocomplete ในกรณีที่มีความซับซ้อนมากยิ่งขึ้น
ให้ดู http://railscasts.com/episodes/102-auto-complete-association
