Lin Lin Dev

       และแล้วก้อถึงเวลาที่ผมจะต้องอัปเดตบทความในบล็อกของผมแล้วคับ บทความนี้ผมจะสอนท่านทำระบบล็อกอินอย่างง่ายๆ ผมได้แบ่งบทความออกเป็นสองตอนคับ ตอนนี้ผมจะสอนการเขียนสคริปต์ JQuery เพื่อตรวจสอบข้อมูลเบื้องต้น คือแค่ตรวจเช็คความว่างเปล่าของTextBoxเท่านั้น ส่วนการตรวจสอบUsernameกับPasswordที่สมาชิกกรอกถูกหรือไม่นั้น ผมจะขอสอนในบทความตอนต่อไป ซึ่งเป็นในส่วนของการเขียนสคริปต์ PHP เพื่อเปรียบเทียบข้อมูลที่สมาชิกกรอกว่าตรงกับข้อมูลในฐานข้อมูลหรือไม่ มาลุยกันเลยครับ      เมื่อสั่งให้รันโปรแกรมขึ้นมา จะปรากฎหน้าตาของโปรแกรมเป็นดังนี้ หากสมาชิกไม่กรอกUsernameกับPassword แล้วกดปุ่ม Login จะปรากฎผลลัพธ์ดังรูป       รูปข้างล่าง แสดงการกรอกข้อมูลที่ถูกต้องและกรอกไม่ถูกต้อง ถ้ากรอกถูกต้อง เส้นขอบของTextBoxจะเป็นสีเขียว หากไม่ถูกต้องจะเป็นสีแดงคับ และจะแสดงไดอะล็อกข้อความเฉพาะข้อมูลที่ กรอกไม่ถูกต้อง ดังรูปข้างล่างเลย

ระบบสมัครสมาชิกตอนนี้เป็นตอนสุดท้ายแล้วคับ และเนื้อหาจะเข้มข้นกว่าเดิม ท่านจะได้เห็นการเขียนโค๊ดที่ซับซ้อนขึ้น  ไม่ว่าจะเป็นการเขียนโค๊ดอัปโหลดไฟล์ และการเพิ่มข้อมูลสมาชิกลงฐานข้อมูล ซึ่งต้องใช้คำสั่ง sql มาเกี่ยวข้องด้วยคับ เรามาลุยกันคับ       อันดับแรกผมจะให้ท่านได้เห็นผลลัพธ์ของโปรแกรมก่อนคับ เมื่อท่านกรอกข้อมูลถูกต้อง และกดปุ่ม Register มันจะแสดงไดอะล็อกแจ้งการลงทะเบียนสมบูรณ์ ดังรูป และข้อมูลก็จะจัดเก็บลงไว้ในฐานข้อมูล ดังรูป ส่วนไฟล์รูปภาพก็จะถูกจัดเก็บไว้ในไฟล์เดอร์ Photo_Member ที่ผมได้สร้างขึ้น ดังรูป

บทความตอนนี้ผมจะสอนการเขียนสคริปต์พีเอชพี ตรวจสอบชื่อผู้ใช้งาน (Username) ว่าซ้ำกันหรือไม่ ซึ่งกฏขั้นพื้นฐานของการพัฒนาเว็บแอพพลิเคชั่น คือ ชื่อผู้ใช้งาน หรือ Username ของแต่ละคนจะต้องไม่ซ้ำกัน เพราะมันมีความจำเป็นต่อการเข้าถึงข้อมูลของบุคคลนั้นๆ  ซึ่งผลลัพธ์ที่ได้จะแสดงผลดังรูป กรณีที่ผู้ใช้งานกรอกชื่อผู้ใช้งาน(Username)ซ้ำ จะปรากฎไดอะล็อกนี้ขึ้นมา และให้กรอกข้อมูลใหม่อีกครั้ง   เรามาดูกันว่า เราจะสามารถเขียนโค๊ดเพื่อตรวจสอบชื่อผู้ใช้งานกันยังไง มาลุยกันเลยคับ!!!! แต่ก่อนอื่น….ท่านได้ศึกษาบทความเหล่านี้หรือยัง --- ระบบสมัครสมาชิก ตอนที 1 --- ระบบสมัครสมาชิก ตอนที่ 2 ++เปิดโปรแกรมDreamweaver และเปิดไฟล์ register.php ขึ้นมา คลิกที่มุมมอง show view code จากนั้นให้ import ไฟล์ config.php เข้ามายังเอกสารหน้านี้ ดังรูป ให้เขียนคำสั่งดังรูปเลยคับ ให้โค๊ดอยู่บรรทัดแรกสุดเลยคับ ++จากนั้นให้กำหนด ค่า VALUE ให้กับControl ตามที่ผมได้ขีดเส้นใต้นี้เลยคับ ภาพนี้เป็นการรับค่า Parameter Request จากการส่งค่ามาแล้วรับเอามาแสดงผลที่เดิม เพื่อไม่ให้ค่าที่เรากรอกตั้งแต่แรกหายไป 

บทความต่อไปนี้ ผมจะสอนการเขียนคำสั่งของ Jquery เพื่อตรวจสอบความถูกต้องจากการกรอกข้อมูลของสมาชิก ก่อนอื่นท่านต้องกลับไปศึกษาบทความในบทที่ผ่านมาก่อนคับ คลิก นี่ เลยคับ หลังจากที่ท่านสร้างฐานข้อมูลและสร้างฟอร์มสำหรับกรอกข้อมูลเสร็จแล้ว ซึ่งผลลัพธ์ที่ได้ผมต้องการให้มันแสดงผลลัพธ์ ดังรูปคับ กรณีที่ไม่กรอกข้อมูลอะไรเลย แต่ดันทะลึ่งไปกดปุ่ม Register มันจะแสดงไดอะล็อกฟ้องดังรูปข้างล่าง กรณีที่กรอกข้อมูลแต่ดั๊นกรอกไม่ถูกต้อง มันจะแสดงไดอะล็อกฟ้องดังรูปข้างล่าง

คราวนี้ผมจะสอนการทำระบบสมัครสมาชิกกันคับ และเราจะนำไฟล์ config.php ที่เราได้สอนทำในบทความก่อนหน้า มาใช้งานในบทความนี้ แต่ก่อนอื่นเราจะต้องสร้างเทเบิลในฐานข้อมูลก่อน เพื่อใช้สำหรับเก็บข้อมูลที่สมาชิกกรอกคับ โดยให้ท่านสร้างเทเบิลตามนี้ได้เลยคับ แล้วตั้งชื่อว่า tb_member คับ หากยังไม่เข้าใจให้ศึกษา นี่ ก่อนคับ จากนั้นให้ท่านเปิดโปรแกรมDreamweaverขึ้นมาแล้วสร้างฟอร์มดังรูปนี้คับ   จากนั้นให้กำหนดProperty name ให้กับInputต่างๆตามนี้เลยคับ แล้ว Save ไฟล์ ชื่อ register.php แล้ว พบกันในบทความตอนต่อไปคับ ^^

หากโค๊ดหรือคำสั่งที่เราเขียนมีความจำเป็นที่จะนำไปใช้ในหลายๆเพจ เพื่อแสดงผลลัพธ์ในลักษณะเดียวกัน เราจำเป็นจะต้องสร้างเป็นฟังก์ชั่นหรือแยกคำสั่งเก็บไว้ในอีกไฟล์นึงแล้ว import เข้ามายังเอกสารที่จะเรียกใช้คำสั่งเหล่านี้ ให้สังเกตดูภาพข้างบนคับ สมมุติว่า xxx คือคำสั่งที่เราใช้งานบ่อยๆ การใช้งานมันจะมี 2 แบบคือ แบบAกับB แบบ A คือ การเขียนคำสั่งเหล่านี้ทุกเพจเลย หากจะแก้ไขคำสั่ง จำเป็นจะต้องแก้ไขทุกเพจที่มีคำสั่งนี้ฝังอยู่คับ ส่วน แบบ B คือ การสร้างไฟล์ขึ้นมา 1 ไฟล์ที่จัดเก็บคำสั่งที่จะถูกเรียกใช้งานบ่อยๆ หากเพจไหนต้องการที่จะนำคำสั่งนี้ไปใช้ เราก็แค่ใช้ฟังก์ชั่น require หรือ include เพื่อ import มาใช้งาน หากจะแก้ไข เราก็แค่เข้าไปแก้ไขไฟล์ที่เก็บคำสั่งนี้ เพียงแค่ไฟล์เดียว ซึ่งก็คือไฟล์ config.php ที่ผมกำลังจะสอนท่านอยู่ในขณะนี้คับ มาลุยกันเลยคับ!!! ++ เปิด Dream ขึ้นมาก เลือก ไปที่ Create New แล้วเลือก PHP  ก่อนอื่นต้อง ตั้งค่าManage Site ก่อนครับ ++ จากนั้นให้ Save ไฟล์ตั้งชื่อว่า config.php ++ คลิกที่มุมมอง Show code view ให้ลบ Tag HTML ที่ Dream สร้างมาให้ ออกให้หมด ...

ก่อนอื่นที่เราจะเริ่มสร้างโปรเจ็คงานของเรานั้น สำหรับคนที่ใช้Dreamเป็นTool Editor สิ่งที่ต้องทำอันดับแรกคือ การตั้งค่า Manage Site เพื่อให้ Dreamweaver ได้รู้จักกับไฟล์โปรเจ็คของเรา จะทำให้การแก้ไขไฟล์ หรือการRunไฟล์มีความสะดวกมากยิ่งขึ้น มาลุยกันเลยคับ!!!! 1 เลือกที่แท็บ Files แล้วคลิกที่ลิสเมนูดังรูป 2 คลิกที่ Manage Sites 3 คลิกปุ่ม New.... 4 คลิกเมนู Site 5 ปรากฎไดอะล็อก ดังรูป ให้เลือกแท็บAdvanced ตรง Category ให้เลือก Local Info 6 ตั้งชื่อให้กับ Site ของเรา 7 เลือก Path Folder ที่เก็บไฟล์โปรเจ็คของเราไว้ 8 เลือก Path Folder ที่เก็บ ไฟล์รูปภาพของโปรเจ็คของเราเอาไว้ 9 เืลือก Links relative เป็น Document 10 กำหนด HTTP address URLของโปรเจ็คของเรา คลิกที่นี่ หากยังงงอยู่  11 จากนั้นใ้ห้เลือก Testing Server เพื่อใช้สำหรับรันดูผลลัพธุ์ของโปรเจ็คของเราบนSever 12 เลือก Server model เป็น PHP MySQL เพราะเราได้ติดตั้ง Apperv ลงไปเรียบร้อยแล้ว 13 เลือก Access เป็น Local/Network คับ เพราะเราใช้ localhost ไม่ได้ใช้ Server จริงๆ 14 พิมพ์ชื่อFolder ที่เก็บไฟล์โปรเจ็คของเรา ต่อท้ายคำ...

วันนี้จะสอน การสร้างฐานข้อมูลด้วยphpmyadmin คับ phpmyadmin คือ โปรแกรมบริหารจัดการฐานข้อมูลmysql ที่ช่วยอำนวยความสะดวกในการจัดการฐานข้อมูล โดยไม่ต้องจัดการฐานข้อมูลผ่านทางหน้าจอ Commandline ซึ่งต้องอาศัยการพิมพ์คำสั่งเพื่อจัดการกับฐานข้อมูลคับ เพื่อไม่ให้เสียเวลา เรามาสร้างฐานข้อมูลกันเลยคับ ++เปิดphpmyadminขึ้นมา  โดยพิมพ์ว่า http://localhost/phpmyadmin จากนั้นจะปรากฎไดอะล็อกบ๊อกให้เราใส่ชื่อผู้ใช้ และ รหัสผ่าน ของMySQL ดังรูป ++การสร้างฐานข้อมูล             1.ให้เลือกชุดตัวอักษรให้รองรับกับภาษาไทย โดยเลือก tis620_thai_ci หรือ utf8_unicode_ci (แนะนำ)            2.ตั้งชื่อฐานข้อมูล แล้วกดปุ่มสร้าง  เราก็จะได้ฐานข้อมูลที่เราสร้างขี้นมา 1 ตัว  ++การสร้างเทเบิลและฟิลด์ในฐานข้อมูลที่เราสร้างขึ้น      1 คลิกเลือกฐานข้อมูล      2 พิมพ์่ชื่อเทเบิล      3 กำหนดจำนวนฟิลด์ในเทเบิลของเรา      4 กดปุ่ม ลงมือ ++การกำหนดชื่อและค่าต่...

ADODB เป็นคลาสไลบารี่ที่เขียนด้วยภาษา PHP มีหน้าที่ช่วยอำนวยความสะดวกกับการเขียนคำสั่ง PHP เพื่อเข้าถึงฐานข้อมูลได้ทุกระบบฐานข้อมูล โดยที่เราไม่จำเป็นต้องเปลี่ยนคำสั่งติดต่อกับฐานข้อมูลตามชนิดของฐานข้อมูล เช่นถ้าจะเข้าถึงฐานข้อมูล Mysql เราใช้ mysql_connect() หากเป็น MS-Access เราใช้ odbc_connect() หากเป็นฐานข้อมูลอื่นๆ เราจึงจำเป็นจะต้องเปลี่ยนคำสั่งเหล่านี้ให้เข้ากับระบบฐานข้อมูลนั้นๆทุกครั้ง ทำให้เกิดความไม่สะดวกในการเขียนคำสั่งที่จะต้องคอยปรับแก้ทุกครั้งไป ถ้าหากเราใช้ ADODB เข้ามาช่วย เราจะใช้คำสั่ง ADOConnection('xxx') xxx คือให้เราระบุ ชื่อของฐานข้อมูลลงไป เช่น เราใช้Mysql ให้ระบุว่า ADOConnection('mysql'); ท่านสามารถศึกษาเพิ่มเติมได้โดยเสิร์ทจากทางกูเกิล มีเว็บไซต์หลายแห่งที่สอนการใช้งานอยู่เหมือนกันคับ ไว้วันหลังผมจะสอนการนำADODBไปประยุกต์ใช้งานกับการทำระบบE-Commerce คับ

Dreamweaver เป็นโปรแกรมที่มีหน้าที่เป็นเครื่องมือช่วยอำนวยความสะดวก ในการสร้างเอกสารHTMLได้อย่างสะดวกสบาย โดยที่เราไม่ต้องเสียเวลากับการเขียนคำสั่งHTMLให้ยุ่งยาก และนอกจากนั้นDreamweaver สามารถสร้างโค๊ดได้หลายภาษา เช่น  PHP, ASP , JSP และการเชื่อมต่อกับฐานข้อมูลได้หลายตัว อาทิ MySQL , MS-Access ,My SQL Server เป็นต้น โดยที่เราไม่ต้องสร้างโค๊ดหรือเขียนโค๊ดเอง ซึ่งหน้าที่เหล่านี้Dreamweaverจะช่วยสร้างโค๊ดให้เราเองคับ ส่วนมากแล้วผมใช้Dreamช่วยในการสร้างเอกสารHTML ส่วนการเขียนคำสั่งPHP มักจะเขียนคำสั่งเหล่านี้เอง โดยไม่ใช้Dramweaverช่วยGanarateโค๊ดให้คับ

Apperv เป็นโปรแกรมที่พัฒนาโดยฝีมือของคนไทย ซึ่งAppervเป็นซอฟต์แวร์ที่มีหน้าที่รวบรวมซอฟต์แวร์ 4 ตัวไว้เข้าด้วยกัน ได้แก่ - Apache - PHP - MySQL - phpMyAdmin มีหน้าที่ติดตั้งและกำหนดค่า Config โดยกำหนด สภาพแวดล้อมต่างๆให้เอง โดยที่เราไม่ต้องConfigเองให้ยุ่งยากและเสียเวลา ท่านสามารถศึกษาเพิ่มได้จากลิงค์เหล่านี้คับ >> ประวัติApperv >> การติดตั้ง

MySQL คือระบบจัดการฐานข้อมูลหรือDBMS โดยใช้ภาษาSQL เป็นซอฟต์แวร์ประเภทOpen Source ที่สามารถใช้ฟรีและแบบใช้ในทางธุรกิจ(เสียตังค์) ซึ่งแบบเสียตังค์จะแตกต่างกับที่ให้ใช้ฟรีคือ การให้บริการด้านการช่วยเหลือเมื่อมีปัญหาจากการใช้งาน โดยจะแบ่งเวอร์ชั่นการใช้งานออกเป็นดังนี้ - MySQL Enterprise - MySQL  Cluster - MySQL Embedded - MySQL Community (Open Source) -->ในบทความของผมใช้งานตัวนี้ ท่านสามารถศึกษาเพิ่มเติมได้จากเว็บไซต์เหล่านี้ได้เลยครับ >> วิกิพีเดีย >> สอนติดตั้งใช้งานและคำสั่งต่างๆที่ควรรู้ >> ตัวอย่างการใช้ฟังก์ชั่นของPHPเพื่อติดต่อกับMySQL (อ่านปูพื้นฐานไปก่อนคับ เด่วผมจะสอนการนำไปประยุกต์ใช้งานอีกทีนึง)