Archive for the ‘Ajax’ Category

รู้มั้ยครับ คุณสมบัติเด่นอีกอย่างนึงของ JavaScript คืออะไร "แดกแรม client" ใช่แล้วครับ มันชอบดูดแรมผู้ใช้งานไปเรื่อย โดนไม่คืนเสียด้วย แถมการ include JavaScript ที่เขียนเยอะๆ ไฟล์ใหญ่ๆ เข้าไปยังทำให้ page load ช้าอีก นอกเหนือจาก เทคนิค การ บีบอัดไฟล์ js แล้ว วันนี้ผมจะมาแนะนำ อีกเทคนิคนึงกัน นั่นคือ...
[audio:http://www.jquerytips.com/song/friday_night.mp3] วันนี้มาแนะนำ plugin ดีๆ อีกตัว... โปรแกรมเมอร์หลายคนที่เขียน ajax หรือ javascript บ่อยๆ คงเคยเจอปัญหา ว่า javascript ไม่ยอม ทำงานต่อหลังจากที่เรา append DOM ใหม่ๆ ที่มี event เข้ามาด้วย จริงๆ ผมก็เคยแนะนำวิธีไปคร่าวๆ แล้วเหมือนกัน
คราวนี้ขอ อัพเดทแบบง่ายๆ ทีนึง พอดีไปแวะ Youtube มาเลยลอง หา jQuery Tutorial มาฝาก คราวนี้เป็น basic ajax ครับ แต่ ajax พื้นๆ ที่ไม่ต้องพึ่งพา ปลั๊กอินใดๆ แค่ jQuery ตัวเดียวก็เหลือแหล่ เนื้อหาก็เป็นการสอน เกี่ยวกับ ajax กับการรับ response ในรูปแบบต่างๆ เช่น html, xml เอาเป็นว่าไปดูกันเองเลยดีกว่า
เรื่อง cross domain กับ ajax จริงๆแล้วในทางทฤษฎี มันควรจะทำได้ครับ แต่ทางปฎิบัติเราติดปัญหาเรื่อง Security เลยไม่อนุญาติให้ทำกัน แต่ทีนี้ผมจะมาพูดถึง ajax cross domain อีกรูปแบบ ในกรณีที่อีก page ต่าง domain ยินยอมให้เข้าไป get ข้อมูล โดย register method ไว้ก่อน ซึ่งลักษณะนี้เรามักเรียกว่า Web Service หรือ API นั่นเอง
ผ่านพ้นสงกรานต์ไปแล้วก็หวังว่าทุกคนคงยังสบายดีกันอยู่นะครับ ไม่ใช่ไปเมาตกน้ำแถวไหน อิอิ (ล้อเล่นนะครับ) ตัวผมเองก็ห่างหายจากการอัพเดทบล๊อกไปนานทีเดียว วันนี้ก็เลยจะมาพูดถึงปัญหาสำคัญที่หลายๆ คนมักตั้งข้อสงสัยกันว่า "ทำไม event ต่างๆที่เขียนในรูปแบบของ jQuery จึงไม่ทำงานหลังจาก ajax call ?"
ช่วงนี้กระแส SEO กำลังแรง เลยขอมาพูดซะหน่อย ^^ ตอนนี้เทรนด์ที่มาแรงในการพัฒนาเวบไซด์คงหนีไม่พ้น Ajax ซึ่งหลายๆคนคงทราบอยู่แล้วว่ามันมีการทำงานยังไง ถ้ายังไม่รู้ก็ลองไปอ่านได้ที่ Blog เพื่อนผมเอง What's ajax แต่ปัญหาที่สำคัญของ Ajax ก็คือเรื่อง SEO นี่แหละ เพราะจากที่ผมทราบ Googlebot ไม่สามารถที่จะอ่าน Javascript หรือ Events ต่างๆ เช่น onclick, onkeypress, on... ต่างๆ ได้ ทำให้เป็นผลเสียกับ SEO เป็นอยากมาก เพราะ Botengine ไม่สามารถที่จะ เก็บข้อมูลเพื่อไปสร้าง Index ให้ได้
เอาล่ะหลังจากทิ้งช่วงอัพเดทไปพักนึง (คนมันงานยุ่งนี่หว่า -*-) วันนี้เรามา advanced แต่ทำง่ายๆ กันด้วยเรื่องของ ajax กับการ submit form หลังอ่านจบคุณจะคิดว่า เทคดนโลยี ajax อะไรเนี่ยมันก็แค่ของเด็กเล่นกันเลย อู้วว์ เรื่องจริง ! คัว jQuery นั้นถ้าใครขยันไปอ่าน manual หรือ api มันบ้างจะเห็นว่ามันสามารถทำงานกับ ajax ได้หลายกรณีด้วยกันทั้งคำสั่ง $.get หรือ $.post ที่เขียนง่ายๆบรรทัดเดียว หรือพวกที่ต้องการข้อมูลเฉพาะๆก็ใช้ $.getJSON, $.getScript ก็ว่ากันไป แต่วันนี้ที่ผมจะมาแนะนำคือคำสั่ง
เอาล่ะครับวันนี้มาแนะนำ plugin ตัวแรกกัน ซึ่ง plugin ตัวนี้รับรองได้ 100% ว่าเพื่อนๆ จะหาจากที่ไหนไม่ได้นอกจาก jQueryTips แห่งเดียว เพราะผมเขียนมาเอง อิอิ สำหรับ plugin ตัวนี้เอาไว้ทำ flush message ที่นิยมใช้ในระบบ shoutbox หรือ news update เป็นต้น รูปร่างหน้าตาเป็นยังไง คลิกไปดูตัวอย่างกันก่อน
เอาล่ะครับ อาจจะข้ามขั้นไปนิด ก็คนมันอยากเขียนอ่ะ บอกไว้ก่อนเลยนี่เป็นแค่ "First Step" เท่านั้น จะมาขอกล่าวเรื่อง พื้นๆที่ jQuery ทำได้ เกี่ยวกับ ajax ก่อน ลึกๆมันเขียนได้หลายรูปแบบมาก สามารถกำหนดลำดับการทำงาน ก่อนหลัง header รวมไปถึงข้อมูลที่รับ กลับมาได้ วันนี้เอา เบาะๆ แค่ การส่งค่าไปมาละกันเน้อ let's begin....