20
2009
jquery and php json
เกือบหนึ่งอาทิตย์เต็มๆเลย กว่าจะมีเวลามาเขียน Block สักที มัวแต่วุ่นวายกับงาน Programming Flash ActionScript 3 ที่ทำให้ Seagate กับ SF Cinemacity เหอๆกว่าจะผ่านไปได้ครับเหนื่อยแทบแย่ วันนี้ผมจะเอาความรู้ที่ทำงานมาแนะนำอีกอันครับ สำหรับเพื่อนๆที่ไม่รู้ หรือเพื่อนๆที่รู้ก็แนะนำเพิ่มได้เลยครับ วันนี้จะมาเสนอเรื่องการใช้ PHP JSON ร่วมกับ jQuery กันครับ การที่จะใช้ function json_encode นั้น php จะต้องเป็น version 5.2.8 ขึ้นไปนะครับถึงจะรองรับการทำงาน Function นี้ Function json_encode() นั้นจะเป็นการแปลง array ให้ออกมาอยู่ในรูปแบบของ json ครับ ตัวอย่างเช่น array(‘name’=>’Root’, ‘age’=>’27′); ถ้านำ array นี้ไปผ่าน function json_encode ก็จะได้รูปแบบดังต่อไปนี้ครับ $arr = array(‘name’=>’Root’, ‘age’=>’27′) ; echo json_encode( $arr ); // output -> {‘name’:'Root’,'age’:’27′} เมื่อรูปแบบที่ออกมาอยู่ในรูปแบบของ json แล้วเราก็สามารถใช้ jquery json เรียกข้อมูลกลับมาแสดงผลได้ ดังตัวอย่างนี้ครับ ผมจะส่งค่า Post ด้วย json [...]
13
2009
เขียน jQuery ยังไงให้เป็นระเบียนดี
ไม่ได้เขียนบทความใน Blog นานแล้ว งานเยอะพอสมควรเลย วันนี้ว่างๆ มานั่งเล่นนั่งทำงาน ที่ร้านกาแฟ Bug & Bee บรรยากาศก็ดีนะ สบายๆ ร้านนี้มีหลายสาขาแต่วันนี้ที่มานั่งก็ที่สาขา สีลม ครับ วันนี้ผมจะมาเสนอวิธีการเขียน jQuery แบบที่จะทำให้เวลากลับมาแก้ code นั้นสบายตาไม่ต้องมานั่งปวดหัวเวลาไล่ code นานๆ จริงๆแล้วน่าจะเรียกว่า style การเขียนของแต่ละคนมากกว่า การเขียน jQuery ส่วนมากผมจะนำมาใช้ในเรื่องพวกการดัก Event ต่างๆที่เกิดขึ้นเช่น onClick, onMouseOver เป็นต้น มาดู Style ผมกันบ้างครับเผื่อจะเป็นประโยชน์สำหรับเพื่อนๆกันบ้าง
9
2009
jQuery Effects slideToggle
เอาล่ะครับเรารู้จัก Effect slideDown และ slideUp ไปแล้ว การทำงานของ 2 Effect ที่กล่าวมาก็คือการ แสดงหรือซ่อนนั่นเอง แต่วันนี้เรามีอีก Effect หนึ่งซึ่งรวมเอาการทำงานของทั้ง 2 Effect เข้าด้วยกัน นั่นก็คือ Effect slideToggle รูปแบบของคำสั่งนี้ slideToggle( speed, [callback] ) Arguments speed รับค่าเป็น String และ number โดยมีค่าดังนี้ครับ (“slow”, “def”, or “fast”) หรือตัวเลข มีหน่วยเป็นมิลิวินาที เช่น 1000 callback นั้นเป็น option คือจะใส่หรือไม่ก็ได้ option นี้เราสามารถใส่ function ที่ต้องการให้ทำงานหลังจากจบการทำงานของ slideToggle เสร็จแล้ว
9
2009
jQuery Effects slideUp
ในครั้งก่อนเราได้รู้จัก Effect slideDown ไปแล้ว คราวนี้จะมารู้จัก Effect slideUp กันบ้างครับ การทำงานจะตรงกันข้ามกับ slideDown ซึ่งก็คือการ Hide นั่นเองครับ รูปแบบของคำสั่งนี้ slideUp( speed, [callback] ) Arguments speed รับค่าเป็น String และ number โดยมีค่าดังนี้ครับ (“slow”, “def”, or “fast”) หรือตัวเลข มีหน่วยเป็นมิลิวินาที เช่น 1000 callback นั้นเป็น option คือจะใส่หรือไม่ก็ได้ option นี้เราสามารถใส่ function ที่ต้องการให้ทำงานหลังจากจบการทำงานของ slideUp เสร็จแล้ว
9
2009
jQuery Effects slideDown
วันนี้เราจะมาแนะนำ Effect slideDown ครับ รูปแบบของคำสั่งนี้ slideDown( speed, [callback] ) Arguments speed รับค่าเป็น String และ number โดยมีค่าดังนี้ครับ (“slow”, “def”, or “fast”) หรือตัวเลข มีหน่วยเป็นมิลิวินาที เช่น 1000 callback นั้นเป็น option คือจะใส่หรือไม่ก็ได้ option นี้เราสามารถใส่ function ที่ต้องการให้ทำงานหลังจากจบการทำงานของ slideDown เสร็จแล้ว
4
2009
jQuery Effect fadeIn
วันนี้มารู้จักกับ effect ของ jquery อีกตัวหนึ่งครับ นั้นก็คือ fadeIn ครับ มาดูกันเลยแล้วกันครับว่ามันทำงานอย่างไร รูปแบบของคำสั่งนี้ fadeIn( speed, [callback] ) Arguments speed รับค่าเป็น String และ number โดยมีค่าดังนี้ครับ (“slow”, “def”, or “fast”) หรือตัวเลข มีหน่วยเป็นมิลิวินาที เช่น 1000 callback นั้นเป็น option คือจะใส่หรือไม่ก็ได้ option นี้เราสามารถใส่ function ที่ต้องการให้ทำงานหลังจากจบการทำงานของ fadeIn เสร็จแล้ว
4
2009
ajax
Ajax (Asynchronous JavaScript and XML) คืออะไร ? Ajax ไม่ใช่ชื่อของการเขียนโปรแกรมหรือเป็นชื่อของภาษาที่ใช้ในการโปรแกรม แต่เป็นชุดของเทคโนโลยีต่างๆ Ajax ย่อมาจาก Asynchronous JavaScript? And XML; ซึ่งหมายถึงการทำงานร่วมกันของ JavaScript? และ XML แบบ Asynchronous มีหลักการทํางาน 2 ประเด็น คือ การ update หน้าจอแบบบางส่วน และการติดต่อสื่อสารกับ Server โดยใช้หลักการ Asynchronous ทําให้ผู้ใช้ไม่ต้องหยุดการทํางาน เพื่อรอการประมวลผลจาก Server รวมถึงการโหลดและการรีเฟรชหน้าจอ ของบราวเซอร์ทางฝั่ง Client มีการใช้ Ajax โดยการเพิ่มเลเยอร์ระหว่าง user browser กับ server ทําให้ผู้ใช้สามารถทํางานได้โดยไม่ต้องรอให้ Client ติดต่อไปยัง Server รวมถึงการโหลดและการรีเฟรชหน้าจอทั้งหมดด้วย ดังนั้นผู้ใช้สามารถใช้งาน application ได้อย่างมีประสิทธิภาพมากขึ้น AJAX จึงไม่ใช่เทคโนโลยีในตัวของมันเอง แต่ว่าเป็นการนำเทคโนโลยีหลายๆ ตัวมารวมกันเช่น JavaScript?, DHTML, XML, Css, Dom และ XMLHTTPRequest
30
2009
วิธีใช้งาน jQuery Cookie Plugin
วันนี้ผมจะมานำเสนอ Plugin อีกตัวหนึ่งที่น่าสนใจครับ เพราะว่านำมาใช้งานบ่อยเหมือนกัน สดๆร้อนก็พึ่งใช้กับระบบ Remember user และ password ของ Form login ก็ใช้งานง่ายดีครับ ทั้งวิธีการ get cookie หรือ delete cookie ก่อนอื่นก็ต้องไปโหลด Plugin cookie ตัวนี้มาก่อนนะครับ สามารถโหลดได้ที่ link นี้ครับ Download : jQuery Cookie Plugin ระหว่างที่กำลังเขียน บทความนี้ ตัว plugin นี้เป็นเวอร์ชั่น 1.0 อยู่นะครับเอาละมาเริ่มวิธีการใช้งานกันเลยครับ
25
2009
การทำงานแบบ Client-side และ server-side คืออะไร
ในการทำงานด้าน Web Programming ในการเขียนโปรแกรมนั้น จะถูกแยกการทำงานออกเป็นสองแบบหลักๆ คือ Client-side และ Server-side ในการเขียนโปรแกรมแบบ Server-side นั้นก็ได้แก่ภาษา php, java jsp, .NET เป็นต้น ซึ่งการเขียนโปรแกรมด้วยภาษาเหล่านี้ จะเป็นการ Run โปรแกรม ในฝั่งของ Server แล้ว return ค่า หรือ แสดงผลกลับมาทาง Client ในที่นี้หมายถึง web browser ต่างๆเช่น IE, Firefox, safari ตัวอย่างการทำงานแบบ Server-side: client เรียก www.google.com –> Server google ประมวลผล —> ส่งค่ากลับไปให้ที่ Client จากตัวอย่างเป็นการเรียก เว็บ Google ผ่าน browser เมื่อมีการเรียก URL ดังกล่าว Client จะทำการส่งคำขอไปทาง server ของ google เมื่อมีการตอบรับ จาก server ของ google ก็จะทำตามคำสั่งที่เขียนใว้ที่ server และจะประมวลผล และส่งค่ากลับมายัง browser ที่ทำการร้องขอไป ส่วนการทำงานแบบ Client Side [...]
23
2009
วิธีการเข้าถึง iframe ด้วย jQuery
เมื่อมีการทำงานผ่าน Iframe หลายๆคนก็คงจะเกิดปัญหาเดียวกันว่า จะทำอย่างไรถึงจะสามารถ ควบคุม หรือ ดึงค่า เช็คค่าต่างๆ จาก iframe ที่เราเรียกมาได้ แต่ขอเน้นอย่างหนึ่งนะครับ การเข้าถึงหรือ access iframe นั้น ถ้าหากว่า iframe นั้นถูกเรียกมาจาก ต่าง Domain name กันจะเกิดปัญหาด้านความปลอดภัย เราจะไม่สามารถ ดึงข้อมูลหรือกระทำอะไรกับ iframe ที่เราต้องการได้เลยครับ ดังนั้น ถ้าจะใช้วิธีนี้ เราจะต้องใช้ iframe ที่อยู่ภายใต้ Domain name เดียวกัน ตัวอย่าง Code HTML : <iframe id=”myIframe” src=”myContent.html” width=”400″ ></iframe> ตัวอย่าง Code HTML ใน File myContent.html : <html> <body> <div id=”myName”> My Name is jQuery.in.th</div> </body> </html>
Tags
Categories
- jQuery 1.4 (8)
- jQuery Mobile (2)
- jQuery UI (2)
- News (2)
- Others (23)
- Plugin (11)
- The basics of jQuery (5)
- Tips (12)
- คู่มือการใช้งาน jQuery ฉบับ ภาษา ไทย (25)
- Ajax (4)
- Attributes (1)
- Core (1)
- Effects (7)
- Events (3)
- Manipulation (2)
- Selectors (4)
- Traversing (2)
- Utilities (1)

An article by



