ทดลองสร้าง RESTful services โดยใช้ Slim PHP Framework

ทดลองสร้าง RESTful services โดยใช้ Slim PHP Framework

จากบทความ REST (Representational State Transfer) คืออะไร? ที่ผมได้อธิบายถึง สถาปัตยกรรมการสื่อสารข้อมูล ซึ่งเป็นแนวทางใหม่ในการสร้าง Web Service แบบเรียบง่าย โดยเรียกใช้งานผ่านทาง HTTP Method GET / POST / PUT / DELETE และส่งข้อมูลออกมาในรูปของ XML วันนี้มีโอกาสได้เขียนบทความ จึงจะเขียนบทความแนะนำ และยกตัวอย่าง แนวทางการพัฒนาเว็บแอพพลิเคชั่นแบบ RESTful Services ซึ่งในปัจจุบันมีผู้ให้ความสนใจมากเลยทีเดียวในเรื่องของ RESTful Services จากการตรวจสอบข้อมูล และความสนใจของผู้ใช...

สร้างระบบ Like แสดงอารมณ์ คล้ายๆ Facebook ด้วย PHP MySQL และ jQuery

สร้างระบบ Like แสดงอารมณ์ คล้ายๆ Facebook ด้วย PHP MySQL และ jQuery

ย้อนเวลาไปไม่กี่วันก่อนหน้านี้ Facebook ได้เปิดตัวปุ่มถูกใจ (Like Button) ที่มีการแสดงอารมณ์ Emoticon ที่หลากหลายมากขึ้น ซึ่งก็เป็นลูกเล่นที่น่าสนใจ สามารถที่จะนำไปพัฒนาใช้งานกับงานของเราได้ เช่น ระบบเว็บบอร์ด หรือ การแสดงความคิดเห็นในหน้าบทความหรือข่าวประชาสัมพันธ์ ในเว็บไซต์ของเรา ให้มีลูกเล่นมากขึ้น วันนี้ผมจึงจะมาแนะนำแนวทางการสร้าง ปุ่มกดถูกใจ (Like Button) แสดงอารมณ์ และลูกเล่นที่หลากหลาย คล้ายๆ Facebook ด้วย PHP, PDO MySQL และ jQuery กันครับออกแบบฐานข้อมูลUsers TableCREATE TABL...

การตรวจจับ และใช้งานโหมดการเขย่า (Shake) ของสมาร์ทโฟนด้วย jQuery.ios-shake

การตรวจจับ และใช้งานโหมดการเขย่า (Shake) ของสมาร์ทโฟนด้วย jQuery.ios-shake

ในบทความนี้ผมจะอธิบายวิธีการตรวจจับการเขย่า (Shake) ของโทรศัพท์โดยใช้ jQuery ผมได้นำมาใช้เป็นแนวทางที่จะนำไปประยุกต์ใช้กับงาน หรือแอพพลิเคชั่นที่จะพัฒนาขึ้นมาในโอกาสข้างหน้า เช่น เขย่าอุปกรณ์มือถือ เพื่อสุ่มคูปองส่วนลดการซื้อสินค้าในหน้าเว็บไซต์ของเรา ให้กับลูกค้า หรือมอบของขวัญให้กับลูกค้าที่เข้ามาซื้อสินค้า และบริการในหน้าเว็บไซต์ของเรา หรือจะนำไปประยุกต์ใช้กับการพัฒนาแอพพลิเคชั่นอื่นๆ เพื่อเพิ่มลูกเล่น และดึงดูดผู้ใช้งานให้เข้ามายังเว็บไซต์ของเรามากยิ่งขึ้น โดยใช้ jQuery Plungin (jQuery.ios-...

เทคนิค Set fullscreen browser window ด้วย jQuery

เทคนิค Set fullscreen browser window ด้วย jQuery

การใช้งานโหมด Full Screen หรือ โหมดเต็มจอใน Web Browser เช่น Google Chrome , Mozilla Firefox , Internet Explorer หรือ Opera นั้นเราสามารถกดปุ่ม F11 บนแป้นพิมพ์ของเราเพื่อ เปิด/ปิด การใช้งานโหมด Full Screen ได้ แต่บางทีเราไม่อยากให้ User ต้องมากดปุ่ม F11 เอง หรือ บางทีมีเหตุผล หรือความจำเป็นที่จะต้องให้โปรแกรมของเราทำงานแบบ Full Screen วันนี้ผมจะมาแนะนำการเขียนโปรแกรม เพื่อ เปิด/ปิด การใช้งานโหมด Full Screen โดยใช้ jQuery กันครับสร้างไฟล์ HTML ดังนี้<html> <head> <title>Fullsc...

มาลองสร้างตารางเรียน แบบ ลาก วาง (Drag & Drop) ด้วย jQuery

มาลองสร้างตารางเรียน แบบ ลาก วาง (Drag & Drop) ด้วย jQuery

บทความนี้เราจะมาลองสร้างตารางเรียน ด้วย jQuery กันครับ โดยใช้ jQuery EasyUI ในการสร้าง โดยใช้เทคนิค แบบ ลาก วาง ( Drag and Drop ) ซึ่งนอกจากการทำตารางเรียน แล้ว ผมคิดว่าน่าจะมีประโยชน์ สำหรับหลายๆคน นำไปประยุกต์ต่อ กับงานอื่นๆ ได้อีก ครับ สำหรับ Code และการใช้งาน สามารถทำตาม Code ด้านล่างได้เลยครับดูตัวอย่างCode หน้าจอรายชื่อวิชา<div class="left"> <table> <tr> <td><div class="item">English</div></td> </tr> ...

มาสร้าง Pattern Input คล้ายๆ Android ด้วย jQuery Pattern Input Plug-in

มาสร้าง Pattern Input คล้ายๆ Android ด้วย jQuery Pattern Input Plug-in

jQuery Pattern Input Plug-in เป็น jQuery plug-in เพื่อสร้างหน้าจอป้อนข้อมูลรูปแบบคล้ายๆ หน้าจอ Passcode หรือ Pattern Log Screen ของ Android ในสมาร์ทโฟน แตกต่างเพียงแค่เรานำมาใช้งานบน Browser ปลั๊กอินนี้ไม่จำเป็นต้องมีการใช้งานรูปภาพ หรือ ทรัพยากรอื่นๆเลย (นอกเหนือจาก jQuery) และ CSS Plug-in ตัวนี้เราสามารถนำไปประยุกต์เป็นระบบการตรวจสอบก่อนการเข้าสู่ระบบ (Login) หรือ ใช้ป้องกันสแปม หรือป้องกันข้อมูลอื่นๆ ตามรหัสที่เราตั้งไว้เบราว์เซอร์ที่รองรับPlug-in นี้ใช้ HTML5 Canvas ซึ่งจะไม่รองรับการแส...

กำหนด Placeholder ให้กับ tag input ใน HTML5 เพื่อให้รองรับในทุก Browser ด้วย jQuery

กำหนด Placeholder ให้กับ tag input ใน HTML5 เพื่อให้รองรับในทุก Browser ด้วย jQuery

Placeholder คืออะไร ผมจะอธิบายแบบสั้นๆเลยนะครับ ก็คือ เป็น Attribute หรือ คุณลักษณะที่กำหนดข้อความที่เป็นพื้นหลัง หรือคำอธิบายคร่าวๆ สำหรับ Input แบบ Text หรือ Textarea ซึ่งคุณลักษณะนี้ถูกกำหนดมาใน HTML5 ซึ่งจะเห็นได้เด่นชัดมากเพราะว่าจะมีแท็ก Attribute นี้เลย Placeholder = 'คำอธิบาย' ส่วนถ้าจะถามผมว่า ถ้าจะใช้ใน HTML ธรรมดาล่ะ? จริงๆมันก็มีเทคนิคหรือ วิธีที่ใช้ในการสร้าง Placeholder มานานแล้วสำหรับ HTML เวอร์ชั่นก่อน หรือสำหรับ Browser ที่ยังไม่รองรับ HTML5 โดยมีวิธีแบบดังเดิม ดั...

ป้องกันไม่ให้เกิด event ของ hashed Anchor แท็ก ด้วย jQuery

ป้องกันไม่ให้เกิด event ของ hashed Anchor แท็ก ด้วย jQuery

ในบางครั้งเราต้องการใช้งาน แท็กลิงค์ (a) หรือ Anchor tag แต่ไม่ได้ต้องการให้มันทำงานเพื่อลิงค์ไปยัง URL เลย เราต้องการเพียงแค่จะดักจับ Event ของมันเพื่อส่งค่า หรือส่งพารามิเตอร์บางอย่างแบบ Ajax ไปเท่านั้น ซึ่งโดยส่วนมากจะนิยมใช้แบบตัวอย่างที่ 1 หรือ 2HTML CODE EX1<a href="javascript:void(0)" class="Click">Click</a> HTML CODE EX2<a href="#" class="Click">Click</a> จากตัวอย่างด้านบนเมื่อเราทำการกดปุ่มลิงค์ (a) หรือ Anchor tag แล้ว Browser จะไม่ทำการลิงค์ไปไหนเลยเราก็จ...

แนะนำ Chosen jQuery plugin สำหรับสร้าง Listmenu แบบเจ๋งๆ

แนะนำ Chosen jQuery plugin สำหรับสร้าง Listmenu แบบเจ๋งๆ

Chosen jQuery plugin เป็น plugin ที่เอาไว้สำหรับสร้าง Listmenu หรือ Select option แบบสุดยอดเลยทีเดียว ซึ่งเจ้าตัวนี้จะมีลูกเล่นในการค้นหาคำ หรือตัวเลือกที่ต้องการ ในกรณีที่ Listmenu หรือ Select option ของเรามีจำนวนข้อมูลที่เยอะ เช่นข้อมูลจังหวัด ถ้าเลื่อนไปหาแบบเก่าๆที่เคยใช้กันคงลำบาก และยังสามารถเลือกตัวเลือก option ได้หลายตัว โดยสามารถส่งค่า Value ไปแบบ Array ได้เพื่อนำค่าไปใช้งาน  สำหรับการใช้งาน Chosen jQuery plugin ก็ไม่ยากครับ เพียงแค่ไปดาวน์โหลดตัว plugin มา&nbs...

แนะนำ jquery barcode plugin สำหรับสร้างบาร์โค๊ด

แนะนำ jquery barcode plugin สำหรับสร้างบาร์โค๊ด

จากบทความ Barcode คืออะไร?วันนี้ผมจะมาแนะนำ jQuery Barcode Plugin เอาไว้สร้าง Barcode เพื่อใช้งานกันครับ ซึ่งสามารถรองรับชนิดของ Barcode ได้หลายแบบ เช่น ean8, ean13, code11, code39, code128, codabar การใช้งานก็ไม่ยากครับเพียงแค่เรา include ไฟล์ jquery-barcode.js ก็สามารถเรียกใช้งาน jQuery Barcode Plugin เพื่อสร้างบาร์โค๊ดได้แล้ว ดาวน์โหลด <script type="text/javascript" src="jquery-1.3.2.min.js"></script>    <script type="t...

แนะนำ jQuery Hotkeys

แนะนำ jQuery Hotkeys

เมื่อเดือนก่อนผมได้รับงานมาทำเป็นโปรเจคเกี่ยวกับการยืม - คืนเอกสาร การพัฒนาก็ใช้ PHP+Mysql กับ jQuery ระบบก็ใหญ่พอประมาณครับ ใช้เทคนิค Ajax ของ jQuery มาพัฒนาระบบทีนี้ ตัวระบบเองจะให้ผู้ใช้มานั่งคลิกแต่ปุ่ม (Button) ที่เราทำให้มันก็ยังไงๆ ไม่ค่อยสะดวกเท่าไหร่ เช่นบางทีพิมพ์ข้อความอะไรลงไปในฟอร์มเสร็จแล้วต้องเลื่อนมือไปจับเมาส์ เพื่อคลิกปุ่ม Submit อีกทีเลยหาวิธีทำยังไงให้กดปุ่ม Enter ที่คีย์บอร์ดแล้วให้ฟอร์มมัน Submit เลย หรือจะค้นหาอะไรในระบบ กดแป้น F2 ที่คีย์บอร์ดแล้วให้ Panel ค้นหามันทำงาน ...

เทคนิคการรับค่าพารามิเตอร์ URL ปัจจุบันโดยใช้ JavaScript และ jQuery

เทคนิคการรับค่าพารามิเตอร์ URL ปัจจุบันโดยใช้ JavaScript และ jQuery

เทคนิคการรับค่าพารามิเตอร์ URL ปัจจุบันโดยใช้ JavaScript และ jQuery เทคนิคเล็กๆน้อยๆ ในการรับค่าพารามิเตอร์ URL ปัจจุบันโดยใช้ Javascript หรือ jQuery นั้นสามารถทำได้ดังนี้ครับ เช่น URL > http://www.example.com:8080/index.php#tab1?id=123 Javascript Property                                            Result ---------------------------------------------------------------------...

COLORTIP jQuery สร้างทูลทิปด้วย jQuery

COLORTIP jQuery สร้างทูลทิปด้วย jQuery

วันนี้มี Plugin สำหรับทำ Tooltip มาฝากกันครับ เอาไปใช้ประโยชน์ในการทำ Tip เวลาเอา Mouse ไป RollOver และขึ้นคำแนะนำขึ้นมา อันนี้พิเศษตรงที่สีสันสวยงามครับ น่าใช้มากๆ ใครนึกไม่ออกมาดูภายด้านในเลยครับDownload ได้ที่ URL นี้ครับ : http://tutorialzine.com/2010/07/colortips-jquery-tooltip-plugin...

แนะนำ jQuery Plugin : jQuery Combogrid

แนะนำ jQuery Plugin : jQuery Combogrid

แนะนำ jQuery Plugin : jQuery Combogrid ทุกวันนี้คงไม่มีใครไม่รู้จัก Jquery เพราะว่าในด้านการพัฒนาแอพลิชั่นบนเว็บนั้นดูเหมือนเป็นสิ่งจำเป็นเลยทีเดียว (จริงๆ javascript framework ก็มีหลายตัวนะ) Jquery คืออะไร บทความนี้ผมจะไม่พูดถึงแล้วนะครับ ผมจะข้ามไปที่ส่วนเสริม หรือ plugin ตัวที่ผมจะนำเสนอเลยjQuery Pluginถ้าพูดถึง jquery plugin หลายๆคนคงเคยใช้ เ่ช่น jquery datatable plugin , fancybox , colorbox , lightbox , autocomplete ฯลฯ แต่วันนี่ผมจะพูดถึง Jquery Combogrid jQuery CombogridJqu...