AJAX ตอนที่ 1
หัวข้อ บทความ แทก Ajax | HTML | JavaScript
ถ้าอ่านแล้วบทความนี้ประดับความรู้ผมก็ดีใจด้วยครับ
แต่ถ้าน้องๆจะมา copy บทความนี้ัไปแปะทำรายงานผมขอบอกว่า โง่เหี้ยๆ
ไม่อยากเปรียบเทียบกับควายควายบ้านผมฉลาดครับ
นึกชื่อหรูๆ ขึ้นหัวไม่ออกเอาดื้อๆแบบนี้แหล่ะครับ ^^
ให้ช่วงปีที่ผ่านมาสำหรับ Web Programmer แล้วคำว่า AJAX น่าจะเป็นคำยอดฮิต
ที่สร้างกระแสให้พวกเราได้ปวดหัวและตามศึกษาอย่างเป็นบ้าเป็นหลัง
ผมเองก็เป็นคนนึงที่โดนกระแสความแรงของมันเข้าไปเต็มๆ และทำให้เกิดบทความนี้ขึ้นมา
- AJAX สามารถทำลายข้อจำกัดของ HTML กับ Server
- AJAX สามารถทำให้ HTML แห้งๆมีชีวิตชีวา ไม่ต่างกับ Windows Application
- AJAX สามารถทำให้ Web Programmer ทุกแขวง (ไม่ว่าจะ Perl PHP ASP ASP.NET) มีเครื่องมือลดข้อจำกัดในการแสดงผลข้อมูลได้
- AJAX ทำให้ Gmail ดังเป็นพลุแตก (Gmail เป็น Web Application ตัวแรกที่ผมพบเจอว่านี่แหล่ะ AJAX)
- AJAX ทำให้ผมแข็งแกร่งเรื่อง Javascript มากขึ้น
- AJAX ทำให้ผมมีความรู้ อิอิ
และทำให้ผมตั้งใจจะเขียนมันให้เพื่อนๆสมาชิกได้อ่านกันติดตามและติชมเนื้อหาของผมได้เลยครับ
พื้นฐานของผู้อ่าน
- รู้เรื่อง Javascript พอสมควร
- เขียน perl,php,asp,asp.net หรือเขียน web application เป็น
- ขยันศึกษาหาข้อมูลจาก Google
ว่าแล้วเริ่มกันเลย
บทนำ AJAX คืออะไร
AJAX ย่อมาจากคำว่า Asynchronous JavaScript and XML แปลตรงตัวแบบกำปั้นทุบดินก็คือ
เทคนิคการใช้ Javascript และ XML ทำงานแบบไม่สัมพันธ์กันตามช่วงเวลา -__-
อ่านแล้วประสาทแดกแน่นอน เดี๋ยวผมอธิบายด้วยรูปภาพดีกว่าจะได้เข้าใจง่ายๆ

รูปจาก
http://www.adaptivepath.com/publications/essays/archives/000385.php
จากรูป ด้านซ้ายเป็นรูปการทำงานของ Browser เมื่อติดต่อกับ Web Server ตามปกติ
การทำงานก็มันก็อย่างที่เราเข้าใจกันคือ เมื่อเรา เรียก url ไป Browser จะทำการติดต่อ
กับ Web Server และ Web Server ทำการประมวลผลส่งค่าเป็น HTML, Image , CSS อะไรก็แล้วแต่
กลับไปหา Browser นำไปแสดงผล
จากหลักการดังกล่าวการพัฒนาให้หน้า Web แสดงผลแบบมีชีวิตชีวา เช่นการแสดงผลข้อมูลแบบ
Realtime ไม่ว่าจะเป็นข้อมูลข่าวสารที่มีการเปลี่ยนแปลงอย่างทันด่วน ยกตัวอย่าง ราคาหุ้น
มีการเปลี่ยนแปลงทุกวินาที หากการติดต่อแบบนี้ Browser ต้องเรียกขอข้อมูลใหม่กับ
Web Server ทุกๆครั้ง
หลายๆท่านอาจจะบอกว่า ใน HTML ก็มี Tag ที่ว่าให้ใช้แล้วนั้นก็คือ
<meta http-equiv="refresh" content="5;URL=url">
ก็ใช่ครับ แต่การใช้ Tag refresh นั้นเป็นการเปลี่ยนแปลงทั้งหน้าจอ
บางครั้งข้อมูลที่ต้องการเป็นข้อมูลแค่กรอบๆเดียวในหน้า web การ refresh ทั้งหน้า
จึงไม่ใช่คำตอบที่ดี (ก็เห็นหลายๆ Web ดันทุรังกันด้วย ใช้ IFRAME อยู่ดี เอาจนได้แหล่ะครับอิอิ)
คราวนี้มาดูหลักการของ AJAX ทางด้านขวาบ้างสิ่งที่เราเห็นก็คือจากรูปจะมีสิ่งที่เรียกว่า AJAX Engine
เข้ามาคั้นกลาง เจ้า AJAX Engine นี้จะทำหน้าที่เป็นตัวกลางในการติดต่อ และนำข้อมูลมาแสดงผลให้กับ
Browser เจ้า AJAX Engine นี้ถูกเขียนด้วย Javascript ครับโดยการที่มันมาคั้นกลางนี้ เราสามารถกำหนด
การรูปแบบการติดต่อของ AJAX Engine ตามเงื่อนไขของ Javascript ที่สร้างขึ้นได้
- ทำให้เราสามารถกำหนดได้ว่า เราอยากให้ tag html ก้อนนี้เปลี่ยนแปลงหน้าตาใหม่ทุกๆ 5 วินาที
- ทำให้เราเปลี่ยนแปลงข่าวสารใหม่ๆได้ตลอดเมื่อมีข้อมูลใหม่เข้ามา (โดยไม่ต้องเรียก Load หน้าใหม่)
จากรูปจะเห็นว่าสิ่งที่ส่งกลับมาให้ AJAX Engine นั้นจะเป็น XML Data ความจริงไม่จำเป็นก็ได้ครับ ^^
ถ้าขี้เกียจตัดข้อมูลก็สามารถนำ HTML มาแปะแสดงก็ได้ ตามรูปเป็นแนวคิดเท่านั้นเอง

รูปจาก
http://www.adaptivepath.com/publications/essays/archives/000385.php
จากรูปเป็นการขยายความของคำว่า Asynchronous ครับให้เราพิจารณาว่า
หาก Browser กับ Web Server มีการ synchronous ระบบดังกล่าวก็คือ
Browser เรียก -> Web Server ตอบ -> Browser รับทราบ แสดงผล
Browser เรียก -> Web Server ตอบ -> Browser รับทราบ แสดงผล
ไปเรื่อยๆ จะเห็นว่า Browser จะทำงานสัมพันธ์กับ Web Server เรียก -> ตอบ -> แสดงผล
แต่กรณีที่ เป็น AJAX นั้น การ Asynchronous นั้นก็คือ
Browser เรียก-> AJAX เรียก -> Web Server ตอบ -> AJAX รับทราบ แสดงผล -> Browser รับทราบ แสดงผล
Browser ไม่เรียก -> AJAX เรียก -> Web Server ตอบ -> AJAX รับทราบ บอกว่าไม่ต้องแสดงผล -> Browser รับทราบไม่แสดงผล
Browser ไม่เรียก -> AJAX เรียก -> Web Server ตอบ -> AJAX รับทราบ แสดงผล -> Browser รับทราบ แสดงผล
กล่าวคือคำว่า Asynchronous มันก็หน้าที่ของ AJAX ที่มาคั้นการไม่ให้ Browser และ Web Server
ทำงานสัมพันธ์กันนั้นแหล่ะ
ส่วนเหตุที่มีคำว่า XML มาด้วย เนื่องจากการเขียน Javascript แบบ AJAX นี้มีการเข้าไปเรียกใช้ Object ของ XMLHTTP
เราจึงให้เกียรติใส่เข้าคำว่า XML ไปด้วย อิอิ ซึ่งจริงๆแล้วข้อมูลอาจจะไม่จำเป็นต้องเป็น XML ก็ได้
อธิบายให้พอคร่าวๆพอเข้าใจก็พอครับ เพราะ อยากให้เข้าใจแนวคิดในรูปแรก ก็พอ
พอเข้าใจแนวคิดรูปแรกแล้วจะกระจ่างในเรื่องต่อไปครับ
ก่อนจะตะลุยผมขอเพิ่มเติมความรู้เรื่อง HTML Javascript ก่อนนะครับ
DIV, innerHTML คือเครื่องมือของเรา
DIV
Tag DIV มันเป็นเหมือน หมุด กำหนด กลุ่ม HTML กล่าวคือ ตัวของ Tag เอง
ไม่มีผลต่อการแสดงผล ของ HTML
เช่น
<div>ข้อความๆ</div>
ผลที่ได้

ก็คือแสดงข้อความตามปกติ
แต่ DIV จะมีความหมายก็ต่อเมื่อเรากำหนดคุณสมบัติให้มัน
เช่น การกำหนดตำแหน่ง ซ้ายขวา กำหนด Style และการแสดงผล
<div align="center">ข้อความๆ</div>
<div align="left">ข้อความๆ</div>
<div align="right">ข้อความๆ</div>
<div style="display: none;">ข้อความถูกซ่อน</div>
ผลที่ได้

จะเห็นว่า การกำหนดคุณสมบัติของ DIV จะมีผลต่อ DIV นั้นโดยตรง
ส่วนใหญ่จากการเขียน AJAX ของผม ผมจะใช้ DIV
- เป็นหมุดในการดึงข้อมูลใน DIV ออกมาแสดงผลหรือเปลี่ยนแปลงข้อมูล
- เป็นหมุดในการเปิดปิดการแสดงผล
ฉะนั้นเราต้องระบุชื่อให้กับ DIV นั้นๆด้วย
สรุปก็คือ
<div id="9AuM">หมุด</div>
ก็จะเป็นรูปแบบสุดท้ายให้อ่านพอเข้าใจครับเดี๋ยวศึกษาเพิ่มเติมจาก ตัวอย่างอีกที
innerHTML
อธิบายไงดีหว่า -__- เป็นการกำหนดว่าสิ่งที่ถูกกำหนดด้วย innerHTML จะแสดงคุณสมบัติเป็น HTML นั้นเอง
| <HTML> <HEAD> <TITLE></TITLE> </HEAD> <SCRIPT LANGUAGE="JavaScript"> function changediv(text){ textshow.innerHTML = text; } </SCRIPT> <BODY> <br> <br> <div id="textshow">ยังไม่มีการคลิกครับ</div> <br> <br> <a href="javascript:changediv('<H1>ข้อความ ขนาด H1</H1>');">ทดสอบ H1</a><br> <a href="javascript:changediv('<u>ข้อความขีดเส้นใต้</u>');">ทดสอบขีดเส้นใต้</a><br> <a href="javascript:changediv('<font color=#FF0000>ข้อความๆ</font>');">ทดสอบข้อความสีๆ</a><br> </BODY> </HTML> |
ลองเรียก Link ต่างๆดูครับ




เรื่อง DIV, innerHTML ก็คงเป็นแนวคิดและมันสามารถช่วยเพิ่มสีสรรให้กับหน้า HTML แห้งๆ
ได้ดีมากลองดูตัวอย่างอีกตัวจาก www.settrade.com

เจ้าเมนูนี้หากเราลองคลิกดูแล้วเมนูจะมีการเปลี่ยนแปลงทันทีโดยไม่มีการ Load ใหม่
หลักการของเมนูแบบนี้ก็คือ การสร้าง Div ไว้หลายๆตัวคือ เริ่มแรกให้ Load ทุกตัว
เข้ามาและกำหนดให้ ซ่อนเอาไว้ เหลือแสดงตัวเดียว และเมื่อมีการคลิก Link ก็ให้เปลี่ยนแปลง
คุณสมบัติของ DIV นั้น
|
<HTML> if (id == 1){ <div id="menu1"> |


หมดกระบวนท่าของ DIV และ innerHTML แล้วครับหวังว่าคงได้แนวคิดกัน
ต่อไปผมจะเข้าเรื่อง AJAX จริงๆแล้วว่ามันจะทำงานอย่างไร
้เนื่อหาบทความนี้ค่อนข้างยาวและอยากปูพื้นความเข้าใจก่อน ถ้าท่านใดมีปัญหาสงสัยก็ post ถามกันได้นะครับจะได้อธิบายเป็นจุดๆไป
AJAX จากโจทย์ตัวอย่าง
หลังจากได้เข้าใจไอเดียและหลักการของ AJAX แล้วผมจะเริ่มการเขียน AJAX โดยขอยกตัวอย่างขึ้นมาให้ลองเล่นกันดู
จริงๆมันเป็นวิธีการสอนที่ผิดหลักการวิชาครุศาสตร์โดยสิ้นเชิงเล่นไม่บอกเนื้อหาเลยล่อตัวอย่างซะแล้ว -__- เอาน่ะลองดู อิอิ
โจทย์ที่ 1 ทำ Script แปลงตัวเลขเป็นตัวอักษร
ออกแนวปัญญาอ่อนแบบนี้แหล่ะครับจะให้เห็นการทำงานและส่งค่าของ AJAX กับ Server
1. อันดับแรกทำ Script ฝั่ง Server ด้วย php เพื่อแปลงตัวเลขเป็นตัวอักษรก่อน
อันนี้ผมไปตบมา -__- นิสัยเสียจริงๆ จำไม่ได้ว่า เอามาจากไหน คุ้นๆว่าจาก php.deeserver.com นี่แหล่ะ
|
num2text.php header('Content-Type: text/html; charset=tis-620'); |
เป็น Script แปลงตัวเลขเป็นตัวอักษรธรรมดาครับ โดยกำหนดผ่าน Get parameter ด้วยตัวแปร id
header('Content-Type: text/html; charset=tis-620');
ผมลองทดสอบกับ Server ผมมันมีปํญหาว่าถ้าไม่ใส่ Text ที่ออกมาจะไม่เป็นภาษาไทย ก็เลยระบุเอาไว้ให้ชัวร์ๆน่ะครับไม่มีอะไร

ผลที่ได้ลองใส่ id = 123456 ไปลงก็ OK
2. อันดับสองทำหน้า HTML Form กรอกตัวเลขเป็นกรอบรอเขียน AJAX
|
num2txt.html |

Form ที่จะใช้แปลงค่า มีช่องให้กรอกตัวเลขและส่วนที่ใช้แสดงผลค่าที่ส่งกลับมา
ในที่นี้ผมจะให้แสดงใน <div id="numtxt">
3. ลง Code ส่วน AJAX ได้เลย
เมื่อเริ่มเขียน AJAX เราก็เริ่มจากการกำหนด Object XMLHTTP ขึ้นมาก่อนแต่เนื่องจากว่า Browser หลายเจ้าก็ต่างมี Object จัดการเรื่อง XMLHTTP
ต่างกันไป ผมก็สรุปเป็น Function (จริงๆก็ copy ตามๆกันมาแหล่ะ) ได้ดังนี้
|
function newXmlHttp(){ if(!xmlhttp && document.createElement){ |
function javascript นี้จะทำการพยายามเปิด Object ไล่ไปตามลำดับ คือ อันไหนเปิดได้ก็ใช้อันนั้นแหล่ะครับ
เมื่อเปิด function ได้ก็จะส่งค่า return กลับไป
มาดู Script ในส่วนการแปลงค่าตัวเลขเป็นข้อความกันเลยครับ
|
function num2text(){ |
การทำงานของ function num2text ก็คือจะอ่านค่าตัวเลขที่ได้จาก form มาลงตัวแปร id
ตัวแปร id ก็จะผูกเป็น url ลงตัวแปร url ส่งไปเข้า การ xmlHttp ทำการติดต่อกับ Server แบบ Get method
แล้วค่าที่ return กลับมาจาก Server (ก็คือข้อมูลที่แปลงเป็นตัวอักษรแล้ว) จะ ถูก innerHTML แสดงผลใน Div numtxt
จบหลักสูตร AJAX ละคร๊าบ ฮา ว่าแล้วสรุป HTML ทั้งหมดได้ดังนี้
|
num2txt.html try{ if(!xmlhttp && document.createElement){ return xmlhttp; function num2text(){ xmlhttp = newXmlHttp(); document.getElementById("numtxt").innerHTML = xmlhttp.responseText; |
Download ไปลองซะ
num2txt.zip
Form เมื่อเสร็จเรียบร้อยแล้ว

กรอกข้อมูลลงไปแล้วคลิกแปลงค่า

ข้อมูลเมื่อคลิกปุ่ม แปลงค่า ไป Javascript จะเปิด Socket เข้ากลับมาที่ Server โดยส่ง Parameter ตามที่เรากำหนดไว้
ข้อสังเกต
การเขียน AJAX คุณจะไม่สามารถ Socket AJAX ข้าม Server ได้เช่น file html วางไว้ที่ Scriptdd.com แต่จะ AJAX ไป หา Sixhead.com เพื่อเรียกใช้งาน
แบบนี้ไม่ได้นะครับ เพราะเป็นเรื่องความปลอดภัย ... คิดดูถ้าทำได้คง ฮาดี เอา Javascript Socket ตัดหน้าแสดงผลดึง Content มาเป็นของตัวเองกัน
มันส์เลย
สรุป
สรุปหลักการแก่นแท้ของ AJAX ก็มีเท่านี้แหล่ะครับ อาทิตย์ต่อๆไป ผมจะนำเสนอการนำ AJAX ไปประยุกต์ใช้งาน, การ post data ด้วย AJAX , การแปลงภาษาไทยต่างๆ,
การเขียน Chatroom แบบไม่มี Reload หน้า, การทำรายงานข่าว Realtime ต่างๆ รอติดตามอ่านกันครับ
Read (26,451)
Comments (104)
2006-01-27 16:32:15
ความคิดเห็น
เยี่ยมเลยครับ
โดยคุณ ชื่นชม
2007-04-27 21:30:56
เขียนเยอะๆ นะคับ เข้าใจง่ายดี ขอบคุณคับ
โดยคุณ mv
2007-04-29 18:46:48
อยากให้เอาเรื่องนี้มาเขียนเยอะๆครับ
โดยคุณ ake
2007-04-30 22:59:18
อธิบายเข้าใจง่ายมากเลยครับ ได้ความรู้กว่าเรียนใน class อีก
โดยคุณ onokung
2007-05-05 07:03:52
ดีมากๆ เลยค่ะ รีบเอามาสอนอีกนะค่ะ
โดยคุณ beau_ko
2007-05-15 11:25:14
thk a lot ครับ ขอบคุณสำหรับเรื่องราวที่น่าติดตาม ครับ
โดยคุณ jommann
2007-05-21 14:59:59
สุดๆ แล้วครับ พี่
อ่านมาหลายที่ วิชาการมากไป
อ่านพี่ กระจ่างครับ
ขอบคุณครับ
โดยคุณ thongD
2007-06-06 18:16:34
ขอบคุณสำหรับบทความนี้ เป็นประโยชน์มากครับ
โดยคุณ sackii
2007-06-26 14:23:04
บ้าทีสุด..ในโลกนี้มีอะไรแปลกๆเยอะๆๆแยะๆๆไปหมด
โดยคุณ คนป่า
2007-06-28 14:00:08
เข้าใจง่ายดีคับ
ตอนนี้ผมกำลังทำโปรเจคอ่าคับ ต้องใช้ Ajax , xml , Java script
อยากเป็นสมาชิกคับ
โดยคุณ อัครชัย โพนสัย
2007-07-01 17:39:48
ชัดเจน เข้าใจง่าย เยี่ยมครับ
โดยคุณ อ๊อบ
2007-07-06 15:36:18
ขอบคุณครับ พอเข้า ใจขึ้นมาบ่างแล้วครับ เพราะ เพิ่งเริ่มเขียน
โดยคุณ buta
2007-07-11 17:43:03
เยี่ยมไปเลยครับ ขอบคุณสำหรับบทความ DD แหล่ม
โดยคุณ Zodiac
2007-07-14 14:44:30
ขอบคุณครับ
แจ่มจริง ๆ
โดยคุณ 123
2007-07-16 12:23:16
นกเอี้ยง บินไปซะที เกาะอยู่ตั้งนาน ไอ้เรื่องเกี่ยวกับ Ajax เนี่ย 555
ขอบคุณมากๆนะครับ
โดยคุณ dookie1983
2007-07-19 12:35:48
ดีมั๊กมากๆค่ะพี่เขียนอีกเยอะนะ เป็นกำลังใจให้คนทำความดี สู้ๆ
โดยคุณ pookpooy
2007-07-23 10:31:43
หาตั้งนาน ว่าทำมัย อาแจก แสดงไทยไม่ได้ แค่ใส่เฮดเด๋อเอง อิอิ เพิ่งหัดเล่นวันแรกคับ อิอิ
โดยคุณ kurt
2007-07-25 15:00:41
ขอบคุณมากครับ บทความดีมากๆๆเลย
โดยคุณ Aod
2007-07-26 07:53:36
เวบคุณ ขยัน Load Adds ด้านล่างจัง นิสัยไม่ดีเอามาทำในทางไม่ดี เดี๊ยว แม่ง ก้อ Disable Javascript แม่งเลย อุตสามาอ่านแล้ว สาด ๆ
โดยคุณ เซ็งเป็ด
2007-08-09 10:48:39
ไม่พอใจก็ไม่ต้องอ่านครับ Web ผมไม่เคยง้อคนอ่าน :P
อีกอย่างเวลาพิมพ์อะไรมาอย่าเกรียนให้มากนัก
Ads โว้ย Ads ไม่ใช่ Adds
โดยคุณ 9AuM
2007-08-09 14:54:56
ชอบครับ ดีมากเลยครับ
เป็นประโยชน์มาก ขอบคุณครับ
โดยคุณ gixgox
2007-08-14 12:53:08
ขอบพระคุณอย่างสูงครับ
โดยคุณ Sittiiii Ch.
2007-08-21 15:40:08
ขอบคุงมากค่ะพี่กะลังหาเรื่องนี้ไปทำรายงานเลย ใจมากๆๆๆๆๆๆๆๆๆๆ
โดยคุณ แบม
2007-08-24 09:56:12
มุขซ่อน <div> พอใช้กับ FireFox มันคลิกแล้วไม่เปลี่ยนค่ะ
โดยคุณ Mumoo
2007-09-04 13:16:42
ขอออกตัวก่อนเลยว่าความรู้ทางด้านพวกนี้น้อยมาก(แทบจะไม่มี)ต้องขออภัยด้วยนะคะ
ที่อยากทราบคือ มี software ERP ตัวใดมีระบบพวกนี้บ้างคะ และถ้า ERP ตัวนั้น ๆ ไม่มี จะทำงานร่วมกับระบบ AJAX อย่างไรให้ เพื่อให้เทคโนโลยี่ที่ใช้ในการแสดงผลรายละเอียดของข้อมูลนั้นเป็น AJAX
รบกวนตอบผ่าน mail ด้วยนะคะ
หรือคุยได้ที่MSN je_ab_je_ab@yahoo.com คะ
โดยคุณ Jeab
2007-09-06 19:23:43
อยากได้เอกสารการเขียน Ajax ตั้งแต่พื้นๆๆได้ไหมครับใครมีช่วยส่งมาให้ผมหน้ยครับ
ผมกำลังจะทำตัวเป็นสาวก Ajax ครับ
โดยคุณ neophysic
2007-09-12 10:15:15
รู้ป่าวครับว่าผมพึงจะเข้าใจ Ajax ก็วันนี้แหละครับ ค้นหามาตั้งนาน ผมเองก็ทำงานเกี่ยวกับด้านนี้โดยตรง ใครอยากคุยกันเรื่อง web site add มาได้ที่ JKmacrows@hotmail.com
โดยคุณ JK-Macrows
2007-10-07 22:24:05
เยี่ยมมากๆ เลยท่าน หวังว่าเว๊ปที่มีความรู้ดีดีแบบนี้ คงจะยังไม่ปิดเว๊ปหายไปไหนนะครับ เผื่อวันหลังๆ ผมจะได้เข้ามาดูอีก
โดยคุณ Very Good
2007-10-08 08:03:13
ดีมากครับ
โดยคุณ เบิ้ม
2007-10-14 01:04:34
เข้าใจง่ายดีจัง ขอบคุณจ้า
โดยคุณ แวะมาดู
2007-10-26 22:02:18
ดีครับ พอดีมีความรู้เรื่อง framework ของ .net มา อ่านแล้วกระจ่างขึ้นเลย
javascript เอ้ย กลับมาก่อน ยังโง่อยู่เลย อย่าพึ่งจากไป อยู่ ๆ ก็เกิดดังระทึกโลกอีกรอบ
โดยคุณ แวะมาอ่าน
2007-10-29 17:06:48
มีฝั่ง Server side script ของ Asp.net เป็นตัวอย่างมั้งไหมอ่ะครับ ถ้ามีรบกวนขึ้นให้นิดนึงจะขอบคุณมากๆๆ
โดยคุณ HighEnD
2007-10-30 15:21:20
บทความเรื่อง Ajax ตอนที่ 1 นี้ดีมากเลยคับอ่านแล้วเข้าใจดีคับ
รบกวนหน่อยคับใครพอมีตัวอย่างการทำภาพให้เลื่อนได้บ้างคับ เช่นพอกดลูกศรไปข้างหน้าแล้วภาพชุดถัดไปก้อจะมาแสดงแทนภาพชุดเก่านะคับ ประมาณนี้ ถ้าให้ดีขอตัวอย่างที่เป็นภาษา asp อ่ะคับ
โดยคุณ Oak
2007-10-31 11:46:15
เยี่ยมครับ อ่านแล้วเข้าใจขึ้นเยอะ
โดยคุณ เยี่ยม
2007-11-15 10:43:00
ยกนิ้วให้ครับ
โดยคุณ mononoke
2007-11-17 22:47:32
ดีครับ แต่อยากทราบประวัติความเป็นมาด้วย (จะเอาไปทามรายงานแต่ดันขี้เกียจ)
โดยคุณ ก็โอเค
2007-11-19 22:51:32
ดีมากเลยค่ะ ชอบมากๆๆ เขียนเยอะๆๆ อ่านแล้วเข้าใจง่ายดี นำตอนต่อไปมาเรือยๆๆ นะคะ จะรอติดตามค่ะ ชอบๆๆ อยากบอกว่า โดนใจ มากๆๆ
โดยคุณ มุมมืด
2007-11-21 11:14:33
ใช้คำง่าย ๆอ่านแล้วเข้าใจกมากครับ เขียนเยอะ ๆ เด้อ เป็นกำลังใจให้
โดยคุณ นีโอ
2007-11-21 15:08:57
ขอบคุณสำหรับบทความดีๆนะคะ ทำให้รู้เรื่องขึ้นมากเลย
โดยคุณ bluesky
2007-11-21 20:47:09
ขอบคุณค่ะ สอนดีมากๆเลย คราวหลังเขียนแบบ java บ้างนะค่ะ ไม่ถนัด php ค่ะ อิๆ
โดยคุณ yui
2007-11-23 13:40:30
ขอบคุณค่ะ อาจารย์
โดยคุณ ginger
2007-11-26 15:29:41
" DIV, innerHTML คือเครื่องมือของเรา
DIV
Tag DIV มันเป็นเหมือน หมุด กำหนด กลุ่ม HTML กล่าวคือ ตัวของ Tag เอง
ไม่มีผลต่อการแสดงผล ของ HTML
เช่น
<div>ข้อความๆ</div> "
จริงๆ แล้ว Div เป็นคำสั่ง ที่มาจาก CSS ใช้สำหรับจัดรูปแบบการแสดงผล
แทนที่จะใช้ตาราง ทำให้ Code เป็น ขยะ เราก็มาจัดระเบียบใหม่ตาม WebStandard
ที่ W3C กำหนด ถ้าสนใจเรื่องนี้ ไปดู เพิ่มเติมน่ะครับ พี่น้อง อ่ะ ลู้ย..
โดยคุณ Jo
2007-11-27 18:32:14
ลองไปดูที่นี่ สิ ครับ http://www.pajax.net
โดยคุณ google
2007-12-10 14:55:21
เอาอีก ชอบๆๆๆ อิอิ
โดยคุณ freshynice
2007-12-10 20:09:56
ครับ มาอ่านพี่แล้ว นำไปผสมผสานกับที่มีอยู่ รู้สึกเข้ากันได้ดีรู้มากขึ้น เยี่ยม ครับ สู้ต่อไปนะนาย
โดยคุณ รัจ
2007-12-12 14:29:50
ขอบคุณคะ
โดยคุณ kaewshop23
2007-12-12 16:18:36
ดีมากครับ...
ขอซั๊กนิดนะครับ..
1. อยากให้ใช้คำสุภาพหน่อย..ครับ
2. อยากให้มีอุดมการณ์แบบนี้ตลอดไป
3. คนที่รู้เรื่องสัตว์โลกทุกชนิด..เก่งที่สุดในโลก..อาจจะไม่รู้จักช้างไทยก็ได้
ส่วนคนที่ไม่รู้จักสัตว์โลกทั้งหลาย...อาจจะเป็นผู้ที่เข้าใจช้างไทยได้เป็นอย่างดี
4. คนเก่ง..อวดเก่ง..ฉลาด...อวดฉลาด...ตำหนิเราก็ช่างเค้าครับ..
เขาสู้เราไม่ได้ตรง.. ความเอื้อเฟื้อปัญหาความรู้.. และช่วยเหลือซึ่งกันและกัน
5. ขอเป็นลูกศิษย์คนนึง
โดยคุณ ่จิตร
2007-12-13 13:51:53
ขอบคุณมากนะครับ
เข้าใจง่ายมากเลย
โดยคุณ เบียร์
2007-12-26 16:38:48
เข้าใจง่ายดี เยี่ยมๆๆๆๆ มาจุ๊บที 55555
โดยคุณ นัท
2008-01-02 11:31:42
สุดยอด
โดยคุณ susa
2008-01-12 11:45:22
ขอบคุณสำหรับความรู้ครับ อธิบายได้ดีมากเลยครับ
โดยคุณ md
2008-01-15 23:10:20
ขอบคุณครับ
โดยคุณ กมล
2008-01-19 21:58:30
AJAX ทำให้ Gmail ดังเป็นพลุแตก (Gmail เป็น Web Application ตัวแรกที่ผมพบเจอว่านี่แหล่ะ AJAX)
//////////////////////////////////////////////
ก็ทีมงาน Gmail เป็นคนคิดค้นเทคนิคการเขียนแบบ Ajax นิครับ
โดยคุณ Sutenm
2008-01-20 19:07:12
ขอบคุณมากๆค่ะ กระจ่างใจเลยทีเดียว
โดยคุณ Ann
2008-02-04 15:51:14
ขอบคุณสำหรับบทความครับ
โดยคุณ jack
2008-02-06 15:07:34
ถ้าอ่านแล้วบทความนี้ประดับความรู้ผมก็ดีใจด้วยครับ
แต่ถ้าน้องๆจะมา copy บทความนี้ัไปแปะทำรายงานผมขอบอกว่า โง่เหี้ยๆ
ไม่อยากเปรียบเทียบกับควายควายบ้านผมฉลาดครับ
...พออ่านบทความที่เขียนก็รู้ว่าเก่งจิง..เข้าจัยในความมีน้ำจัย..แต่ติดตรงประโยคข้างบนนี้แหละอ่านแล้วรู้สึกไม่ดีเลยคนอื่นก็คงเช่นกัน..ถ้าไม่อยากให้ใครก็อบทำไมไม่ทำให้มันก็อบไม่ได้ซะเลย
โดยคุณ คนขี้สงสัย
2008-02-10 01:39:22
เรียนคนขี้สงสัยครับ ![]()
ผมยอมรับและยินดีว่าบทความที่ผมเขียน ต้องการให้ส่งเสริมองค์ความรู้พื้นฐาน เพื่อให้ผู้อ่าน
สามารถนำไปต่อยอดความคิดในเรื่องลึกๆต่อไปได้
ในใจลึกๆที่ผมต้องการคือ อยากให้ผู้อ่านนำความรู้ไปประยุกต์และคิดต่อยอดในเรื่องนั้นๆ
ไม่ใช่การ copy บทความส่งเป็นรายงานให้อาจารย์
ใน Scriptdd มีอาจารย์หลายๆท่านเข้ามาอ่านนะครับ เท่าที่ผมรู้นี่ ก็ กรุงเทพ เชียงใหม่ ภูเก็ต มีหมด และหลายๆอาจารย์ก็มักจะให้รายงานลักษณะนี้เพื่อให้นักศึกษา หาความรู้ด้วยตัวเอง
ผมเอง ซึ่งในฐานะ ที่จบคณะ ครุศาสตร์อุตสาหกรรม
คงทำใจไม่ได้เหมือนกัน ถ้าความคิด ความรู้ที่เรารวบรวมทำเป็นบทความเพื่อให้ผู้อ่าน
ต่อยอดความรู้ กลับเปลี่ยนความตั้งใจ กลายเป็นผลงานในรายการฉบับนึงเท่านั้น
ฉะนั้น ถ้าใครรูดมาอ่านความคิดเห็นนี้ คงเข้าใจในความคิดผมบ้าง (บ่นเล็กๆ น้อยใจหน่อยๆ)
ภายใต้คำด่าคำว่าแรงๆ มันมีจุดประสงค์ของมันอยู่
บางครั้งผมกลับคิดว่า คำด่า คำว่าพวกนี้ มันอาจจะสร้างความกดดันทางความคิดให้คุณ
ให้คุณรู้สึกต้องการศึกษาอะไรเองบ้างก็ได้
แม้ว่าคุณจะด่าพ่อผมในใจ แต่ถ้ามันทำให้คุณได้ความรู้ ผมก็ยินดีครับ
ขอบคุณที่อ่านมาจนจบ
9AuM ตื่นมาจากพิษไข้ ไล่ตอบความคิดเห็นแบบ เบลอๆ
โดยคุณ 9AuM
2008-02-10 02:45:54
พึ่งมาเจอ บทความดี ๆ ขอบคุณครับที่ที่เอื้อเฟื้อแบ่งปันความรู้มาให้ จะลองทำตาม กำลัง โหลด MS4W ถ้าสำเร็จคืนนี้คงได้เล่น อิอิ
โดยคุณ pimthun
2008-02-10 23:07:24
Thank you teacher.
โดยคุณ โจ
2008-02-17 00:17:43
ขอบคุณมากคะ อยากรู้มานานเเล้ว
โดยคุณ หญิงเเพท
2008-02-17 12:03:03
ดีครับ
ใครมีข้อมูลก็แบ่งๆกันครับ
โดยคุณ Reakchai
2008-03-02 17:25:31
good ดีมากๆ ครับ ชอบๆ
โดยคุณ dbzthai
2008-03-05 12:55:13
ขอบคุณนะครับที่แบ่งปันความู้
โดยคุณ kapeak
2008-03-07 13:52:28
สุดยอดครับ สร้างคนให้มีความรู้ดีกว่าการสร้างวัด
โดยคุณ dependent
2008-03-10 11:46:59
โดยคุณ xxx
2008-03-18 15:20:11
ขอบคุณอย่างสูงครับผมกำลังพยายามศึกษา ajax อยู่พอดี
เรียน คุณ Sutenm
google เป็นเจ้าแรกๆ ที่ใช่ ajax ที่ ajax ไม่ใช่เทคโนโลยีใหม่แต่เป็นการผสมผสาน ประยุกต์ใช้งานในสิ่งที่มีอยู่แล้ว
โดยคุณ ปริญญา
2008-03-18 17:32:42
ภาษาเข้าใจง่ายไม่ยืดยาว เน้นๆ เห็นภาพสุดๆ หามานานขอให้เขียนต่อไปนะครับ ต่อไปออกหนังสือเลยครับ ajax สำหรับชาวบ้าน 555
โดยคุณ สุดยอดยกนิ้วให้ครับ
2008-03-22 16:05:17
ใช่ครับ ใครลอกไปทำรายงานก็โง่เต็มทีแล้ว เพราะคนเขียนเขาก็ไป copy มาจากที่อื่น แล้วเอามาแปลอีกทีนึงเช่นเดียวกัน เขาไม่ได้เขียนเองครับ ลอกมาอีกทีนึง
โดยคุณ ผ่านมา
2008-03-25 09:23:10
เกรียนเต็ม web ตูเลยเว้ย
คุณผ่านมาครับ อย่ามาใช้คำว่า ลอกกับ คนอย่างผมเลย
ผมอ่านสรุปย่อและทำความเข้าใจในเนื้อหา ถึงออกมาเป็นภาษาไทยให้พวกคุณๆได้อ่านกัน
รูปที่คุณเห็นผมก็อ้างอิงที่มา
ถ้างานเขียนแบบนี้มันขี้กาก ในสายตาเกรียน อย่างพวกคุณมาก
อย่าอ่านมันเลยครับ
ผมก็สบายไม่ต้องมาปวดหัวหาความรู้มาสรุปลง web ให้
สบายผม สบายสมอง ทำมาหากินดีกว่า
โดยคุณ 9AuM
2008-03-25 12:36:40
เยี่ยมมาก ครับ ขอชื่นชมผมเองเขียน java app อยู่คิดจะหันมาลอง ajax อยู่เหมือนกัน
โดยคุณ java developper
2008-03-26 18:21:26
พวกนี้ ก็ coppy เขามาส่วนหนึ่งไม่ใช่เหรอ
แล้วไย ไปด่าคนที่จะมาทำเหมือนคุณ เหมือนด่าตัวเองยังไงไม่รู้
โดยคุณ -
2008-03-29 21:53:36
เรียนคุณ -
กลับไปอ่านทุกความคิดเห็นให้เรียบร้อยก่อนแล้วค่อยคุยกัน
โดยคุณ 9AuM
2008-03-30 01:11:40
มีประโยชน์มากครับขอตรบมือ มีเรืองใหม่ๆก็บอกกันด้วยน่ะครับขอบคุณครับ
โดยคุณ แดง
2008-04-04 15:44:55
ขอบคุณมากคับ
มันเป็นไปได้อย่างไร
โอ้ว จอร์ด มัน ยอด มาก
โดยคุณ Mckaty
2008-04-05 17:39:01
อื้อหือ สุดยอด
โดยคุณ udo_thekid
2008-04-10 14:02:46
สุดยอดครับนี้ล่ะที่ผม ตามหา คือบทความดีๆ แบบ นี้ ขอบคุณมาก ๆ ครับ
โดยคุณ InTacT.
2008-04-16 14:40:07
ขอสนับสนุนคนคิดดีทำดีอย่างคุณ 9AuM ครับ เป็นการแชร์ความรู้ให้คนอื่น ไดบุญด้วย
ทำต่อไปครับ ได้ประโยชน์ครับ
อย่าไปสนใจเสียงนกเสียงกา มือไม่พายแล้วยังเอาตีนลาน้ำอีก ไม่มีไอ้พวกนี้สังคมคงดีขึ้นครับ
โดยคุณ ฅน
2008-04-18 09:32:07
สุดยอด...อธิบายได้กระจ่าง ที่จริงผมอยากศึกษาเรื่องนี้มานานแล้ว ยังไม่มีบทความอ่านแล้วเข้าใจง่าย และเข้าใจแนวทางอย่างนี้เลย
.........................................
ผมเป็นครูน้อย ๆ ขอคาระวะท่าน 1 จอก
โดยคุณ ครูน็อต
2008-04-25 14:58:17
เขียนฟังก์ชันได้สุดยอดมาก ๆ เลย ขอบอก
โดยคุณ
2008-04-28 17:28:46
เขียนอธิบายได้ดีมากครับ พอเห็นภาพรวมและแนวทางมากขึ้น แล้วผมจะคอยติดตามผลงานนะครับ (อยากให้ผู้ที่คิดทำดีช่วยสนับสนุนคนดีๆที่มีจิตเป็นผู้ให้)
ปล.คนคิดไม่ดีก็เลยทำตัวไม่ดี เลยพาลคิดว่าคนอื่นจะต้องเป็นคนไม่ดีแบบตัวเขา
โดยคุณ ดูดี
2008-05-05 20:56:54
โดยคุณ sa
2008-05-08 16:54:08
รออ่านบทความเรื่องนี้ต่อครับ อ่านง่าย สนุกดี น่าติดตามต่อ
โดยคุณ ณัฐพัชร์
2008-05-21 17:34:06
พระพุทธเจ้า กว่าจะทรงตรัสรู้ได้ ก็ต้องมีมารมาผจญ เปรียบมารพวกนี้กับพวกที่ดีแต่ตำหนิติเตียนผู้อื่น แต่ไม่คิดจะทำอะไรให้กับผู้อื่น
เป็นกำลังใจให้กับคุณ 9AuM ค่ะ
อย่าเอาคำพูดของคนพวกนี้เป็นอารมณ์เลยนะคะ จะขอติดตามบทความต่อๆไปของคุณนะคะ
โดยคุณ cane
2008-06-02 13:37:25
ยากไปแต่ก่เข้าใจแล้ว
โดยคุณ nextday
2008-06-04 13:39:17
ขอบคุณสำหรับความรู้มากครับ
อ่านรอบแรกแล้วยัง ไม่ค่อยเข้าใจเท่าไหร่ แต่จะพยายามทำความเข้าใจให้ได้ครับ
โดยคุณ โฮม
2008-06-11 22:27:30
จิงๆ ผมไม่ต้องใช้ Ajax โดยตรงแต่ก็ต้องไปคุยกับคนที่ทำ
เพื่อให้เข้าใจว่าเค้ากำลังทำอะไรได้มากขึ้น ก็เลยมาอ่าน อ่านแล้วก็
ปัญญาเกิด
ขอบคุณนะครับทำให้ผมเห็นภาพ AJAX ชัดเจนขึ้นเยอะเลย
โดยคุณ PaPa
2008-06-16 11:52:06
เขียนเข้าใจง่ายมากเลยค่ะ ขอบคุรมากนะคะ
โดยคุณ nok
2008-06-16 22:39:57
ให้ความรู้ใหม่ๆที่ดีขั้น
โดยคุณ mon<Gom>
2008-06-19 19:47:19
ตาสว่างเลยครับพี่น้อง
โดยคุณ .....
2008-07-09 15:12:19
เจ๋งๆ ขอบคุณครับพี่
โดยคุณ tong
2008-07-13 21:11:10
ขอบคุณสำหรับความรู้นะคะ
โดยคุณ akasayu
2008-07-23 15:21:02
ขอบคุณมากครับ แต่ขอบอกความหมายของตัวแปรที่กำหนดซักนิดนึงครับตรงที่
xmlhttp.open("GET", url, false);
parameter ตัวที่ 3 ที่ใช้ false หมายถึงการรับส่งข้อมูลแบบ synchronous ครับ
ถ้าจะกำหนดให้เป็น Asynchronous ต้องกำหนดเป็น true ครับ ผม แล้วจำเป็นต้อง มี statechange ด้วยครับถึงจะเป็น ajax แท้ๆ
โดยคุณ wikie
2008-07-30 14:35:25
ขอขอบคุณครับ อ่านบทความของคุณแล้ว ผมเข้าใจเป็นอย่างดียิ่งขึ้น ขอให้มีบทความออกมาอีกนะครับ จะคอยติดตาม
โดยคุณ sanova
2008-08-03 23:11:42
โง่เหี้ยๆ
ไม่อยากเปรียบเทียบกับควายควายบ้านผมฉลาดครับ ตรงนี้สิความรู้ที่แท้จริง
โดยคุณ คนโง่
2008-08-04 21:55:24
55+
่อ่านแล้วเข้าใจดีีค่ะ..
^^
โดยคุณ oO น้อง ร่า
2008-08-20 14:46:01
ขอบคุณครับ
โดยคุณ ท๊อป
2008-08-26 19:13:42
จากที่เข้าใจอยู่แล้วกระจ่างมากขึ้นค่ะ...
โดยคุณ ไก่ AQA
2008-08-28 11:03:50
ขอบคุณ คับ
โดยคุณ vee
2008-09-03 00:44:50
ขอบคุณครับ (ยังไม่ได้อ่านเยอะ) ยังไงถ้ามีอีกก็เอามาเสริมให้อ่านอีกด้วยนะ จะไ้ด้ไม่เสียเงินซื้อหนังสือเกินความจำเป็น.
โดยคุณ DET
2008-09-30 21:01:36
ขอบคุณครับ
ได้ความรู้มากๆเลย
กำลังสนใจเรื่อง ajax อยู่พอดี
อยากให้สอนเรื่องการส่งค่าแบบ get กับ post ข้ามไฟล์อ่าครับ(Ajax)
ท่าน admin มีเมลล์ติดต่อมั้ยครับ อยากถามเกี่ยว ajax นี่แหละครับ
โดยคุณ Book
2008-10-02 00:54:38
ตกไปดาวนึง อิอิ
โดยคุณ Book
2008-10-02 00:55:35
ขอบคุณนะคะ
ทำให้เข้าใจขึ้นเยอะเลยค่ะ
โดยคุณ ph
2008-10-04 14:22:22
ได้ความรู้มากครับ ผมชอบเรื่องแบบนี้อยู่แล้ว ผมขอให้ท่าน admin ได้ทำเว็บให้ความรู้ตลอดไปนะครับ
โดยคุณ skyone
2008-10-06 10:02:51
<i>ajax</i> ต้องลองแล้ว
โดยคุณ ^_^
2008-10-14 15:55:45