Infinite Web Development

Rails นั้นเป็น framewrok ที่ support การใช้งาน AJAX อย่างหลากหลาย ในรูปแบบของ helper (function ที่ช่วยในการ render html หรือ javascript ของ Rails) เพื่อไม่ให้เป็นการเสียเวลา และเสียพื้นที่ entry ก็ดูตัวอย่างกันเลยดีกว่า

อย่างแรกในการใช้งาน AJAX เราต้อง include library ที่ชื่อ Prototype เข้ามาใน web page ของเราก่อน ซึ่ง web page ใน Rails นั้นก็คือ file นามสกุล erb (ถ้าจำไม่ผิดน่าจะย่อมาจาก embeded ruby)

เพราะงั้นใน file .erb ของเราจะต้องมี code ส่วนนี้แปะอยู่

<script type="text/javascript" 

  src="/javascripts/prototype.js"></script>

เวลาที่เรา install Rails นั้น มันจะลง Prototype.js มาให้เราเรียบร้อย อยู่ใน folder '/public/javascripts/' ดังนั้น Prototype ที่ว่านี้จึงถือเป็น AJAX library หลักที่ Rails เลือกมาไว้ให้เราใช้งาน เพราะงั้น AJAX helper ต่างๆของ Rails ก็จะไป render คำสั่งที่เรียก function ใน Prototype มาใช้งานนั่นแหละ....พูดวกวนจังแฮะเรา 55555

อ้ออีกอย่างเราสามารถใช้ helper ช่วยในการ include javascript ได้ อย่าง code ข้่างบนเราสามารถเขียนใหม่ได้ดังนี้

<%= javascript_include_tag("prototype.js") %>

ซึ่งมันก็จะ render ออกมาเหมือนกะ code ชุดแรกนั่นแหละ  ...จริงมีรายละเอียดปลีกย่อยอื่นๆเกี่ยวกะ helper อยู่อีก แต่ entry นี้ยังอีกยาว ขอข้ามไปดีกว่า 55555

ต่อไปเมื่อเรา include prototype แล้วเราก็จะมาดู AJAX helper ตัวแรกกัน นั่นก็คือ "link_to_remote"

link_to_remote เป็น herlper ที่ใช้ render AJAX link โดยจะมีตัวอย่างการใช้งานง่ายๆดังนี้

<%= link_to_remote "Add user", :url => {:controller => "user", :action => "create"} %>

code ข้างบนเป็นรูปแบบที่ง่ายสุดของการทำ AJAX นั่นคือเราไปสร้าง link ที่มีข้อความว่า "Add user" และใน link นั้นก็ไปเรียก function ในฝั่ง server ให้ทำงาน โดยไปเรียก function ชื่อ create ของ controller ที่ชื่อ user ส่วนในหน้าจอจะไม่มีมีอะไรเปลี่ยนแปลง

แน่นอนว่าตัวอย่างข้างบนเราคงไม่ค่อยได้ใช้เท่าไหร่ เพราะปกติเวลาเราส่งอะไรไปที่ server เราก็มักจะต้องการ response(ผลตอบรับกลับมา) ซึ่งจะทำได้ดังตัวอย่างถัดไป

<%= link_to_remote "Add user", :url => {:controller => "user", :action => "create"}, :update => "user_div" %>

จากตัวอย่างข้างบนนั้น มีสิ่งที่เพิ่มมาคือ :update => "user_div" ซึ่งหมายถึงการเตรียมรับ response จาก server โดยเมื่อ server ส่งอะไรกลับมาให้ไป update ลงใน element ที่มี id ช้ื่อว่า "user_div" นั่นเอง ส่วนใน controller user หน้าตาของ method ก็จะเป็นอย่างนี้...

class UserController < ApplicationController
  def  create
        #....... code ในการ create user...... ขอละไว้ครับ
    render :text => "complete" 
  end 
end

จากตัวอย่าง controller จะ return คำว่า complete มาแปะไว้ที่ user_div ซึ่งแน่นอนว่าเราสามารถ return เป็น html code กลับมาได้เช่นกัน

เป็นไงครับ จะเห็นว่า AJAX on Rails มันก็แค่นี้เอง(easyๆ) ว่างๆจะมาต่อภาค 2 เป็นภาคเจาะลึกดีกว่า