[แจกฟรี] AJAX Shoutbox พร้อมโค้ด ตอนที่ 1
Shout box เนี่ยน้องๆ Chat เลยละครับ คือมีการโพสต์ข้อความ แล้วก็แสดงผลโดยอัตโนมัติ ข้อดีคือ เมื่อเรากดส่งข้อความ ข้อมูลจะถูกส่งไปบันทึกโดยที่ไม่ต้อง Reload หน้าทั้งหน้าใหม่ นอกจากนี้ในการอ่านข้อความมาแสดง ยังเป็นการอ่านด้วย AJAX อีกที เรียกได้ว่า เพิ่มระบบ User อีกอย่างก็เป็น Chat แล้วละครับ เหมาะสำหรับศึกษาการทำงานของ Chat Room ได้ดีเลยครับ
คุณสมบัติ
การติดตั้งลงบนหน้าเว็บไซต์เป็นโค้ด IFRAME
หลักการทำงานจะแบ่งออกเป็น 2 ส่วนหลักๆครับ คือส่วนของการโพสต์ และส่วนในการอ่านข้อมูลมาแสดง โดยในส่วนของการโพสต์ข้อความจะเป็นการโพสต์โดย AJAX ไปยัง Server เพื่อบันทึกลงฐานข้อมูล(ไฟล์) เมื่อทำงานเสร็จจะเป็นอันจบกระบวนการในส่วนนี้ และในส่วนที่ 2 เป็นการใช้ AJAX เพื่อทำการอ่านข้อมูลจากฐานข้อมูล แล้วมาแสดงผลเป็นวงรอบไปเรื่อยๆ
คุณสมบัติ
- เก็บข้อมูลในแบบ Text รองรับหลายภาษา
- เป็น iframe ทำให้สามารถเรียกแสดงบนหน้าอื่นได้
- สามารถปรับแต่งรูปแบบ (theme) ได้อย่างอิสระ ด้วย CSS ในไฟล์ style.css
- รองรับการใช้งานบนมือถือ (ที่รองรับ HTML5)
การติดตั้งลงบนหน้าเว็บไซต์เป็นโค้ด IFRAME
<iframe src="shoutbox/index.html" style="border:none;width:100%;height:400px;"></iframe>
หลักการทำงานจะแบ่งออกเป็น 2 ส่วนหลักๆครับ คือส่วนของการโพสต์ และส่วนในการอ่านข้อมูลมาแสดง โดยในส่วนของการโพสต์ข้อความจะเป็นการโพสต์โดย AJAX ไปยัง Server เพื่อบันทึกลงฐานข้อมูล(ไฟล์) เมื่อทำงานเสร็จจะเป็นอันจบกระบวนการในส่วนนี้ และในส่วนที่ 2 เป็นการใช้ AJAX เพื่อทำการอ่านข้อมูลจากฐานข้อมูล แล้วมาแสดงผลเป็นวงรอบไปเรื่อยๆ