Yii basic full

Page 1


คำนำ เมื่อช่วงต้นปี 2552 ผมได้ยินชื่อของ Yii Framework มาบ้างแล้ว ว่า เป็นสุดยอดแห่ง Framework PHP ที่ดีเยี่ยม อลังการ และดีที่สุดในโลก แต่ใน ตอนนั้นผมมีงานต้องทำมากมายหลายอย่าง อีกทั้งใช้ Framework ตัวอื่นอยู่ และก็เชื่อว่าดีเลิศที่สุดแล้ว จึงไม่ได้ศึกษา Yii Framework แต่อย่างใด กระทั่งมาถึงปี 2553 ก็ได้ยินว่าเพื่อน ๆ หลายคนในวงการของผมเขา หันไปใช้ Yii Framework กันหลายคนแล้ว และต่างก็พยายามแนะนำผมให้ ลองศึกษานำไปใช้กับงานดู ด้วยความสงสัยเหลือเกินว่าทำไมนี่จึงเป็นสุดยอด แห่ง Framework อันดับ 1 ของโลกได้ มันเป็นเพราะกระแสหรือเปล่า ก็ไม่น่า เป็นไปได้ เพราะติดอันดับ 1 มาหลายปีอย่างต่อเนื่อง แสดงว่ามันต้องมีอะไร บางอย่างที่เจ๋งจริง ๆ แล้วมันคืออะไรล่ะ ??? จนมาถึงปี 2554 ต้นปี ผมได้เริ่มศึกษา ค้นคว้า และนำมาใช้กับการ พัฒนาระบบของผมอย่างจริงจังจนถึงปัจจุบันนี้ เริ่มจากระบบแรก และระบบ ที่สอง สาม สี่ ห้า ... ตามลำดับ ความรู้สึกบอกได้เพียงว่า นี่แหละ ที่ผมหามา ตลอดชีวิตของการเป็น โปรแกรมเมอร์ แต่ด้วยตำราภาษาไทยไม่มีเลยในท้อง ตลาด อีกทั้ง Yii เป็นสิ่งที่มีเนื้อหาค่อนข้างมาก ยืดหยุ่น จึงเป็นอะไรที่ต้อง ถ่ายทอดกันจากประสบการณ์ตรง ๆ ยิ่งทำให้ค้นหาตำราได้ยากขึ้นอีกแม้จะ เป็นตำราจากต่างประเทศ ก็ยังนับเล่มได้เลย ผมจึงได้เริ่มจัดทำหนังสือ Yii Framework เล่มนี้ขึ้นมา เพื่อถ่ายทอด ความรู้ และประสบการณ์ตรงของตัวเอง โดยเล่มนี้คือหนังสือที่ดีที่สุดเท่าที่ ผมเคยเขียนมา ทั้งทุ่มเท ใส่ใจ และคัดสรรเอาเฉพาะตัวอย่างที่ต้องได้พบเจอ จริง ๆ มานำเสนอ รวมทั้งเปิดเผยแบบไม่มีกั้กแม้แต่น้อย มีอะไรก็เล่ามันออก มาให้หมด และอธิบายแบบเป็นขั้นตอนตั้งแต่เริ่มต้นสำหรับมือใหม่ที่ยังไม่เคย เขียนโค้ดในแบบของ Framework MVC มาก่อนเลย ก็สามารถเริ่มต้นได้ทันที ที่สำคัญที่สุดคือ อ่านแล้วทำตามได้ พร้อมกับนำไปใช้งานได้จริงในการทำ ระบบของคุณ หนังสือเล่มนี้จะเสร็จสิ้นออกมาไม่ได้หากไม่มีการจองจากสมาชิก เพราะยอดจองที่สั่งเข้ามาเป็นกำลังใจหลักที่ทำให้ผมมีแรงเขียนหนังสือเล่มนี้ จนเสร็จสิ้นได้ในเวลาอันรวดเร็ว เพราะปกติเขียน 6 เดือนต่อเล่ม แต่เล่มนี้ เขียนเพียง 2 เดือน เท่านั้น ผมหวังเป็นอย่างยิ่งว่าผู้อ่านจะได้นำความรู้จาก เล่มนี้ไปใช้ประโยชน์ในงานที่เป็นอยู่ ไม่มากก็น้อย ผู้เขียน ถาวร ศรีเสนพิลา


สารบัญ บทที่ 1 แนะนำ Yii Framework ก่อนเข้าเนื้อหา อะไรคือ Yii Framework ทำไมเราต้องเขียนด้วย Framework ทำไมต้อง Yii ทำไมต้องเป็นหนังสือเล่มนี้ จุดเด่น ความรู้ที่ต้องเตรียมมาก่อน เริ่มต้นดาวโหลด เริ่มการติดตั้ง Hello World ปิดท้ายบท

1 1 2 3 4 5 5 6 7 9 10

บทที่ 2 MVC ก่อนเข้าเนื้อหา รู้จัก MVC เริ่มต้นใช้ NetbeansIDE เตรียมโปรเจค Function & Parameter การผูกเข้ากับ view การแทรกภาพลงหน้าเว็บ การส่งค่าจาก view ไปให้ controller ปิดท้ายบท

11 11 13 14 16 18 20 21 23

บทที่ 3 Form ก่อนเข้าเนื้อหา

24


Form ของ Yii ดีอย่างไร เริ่มต้นสร้าง Form อย่างง่ายด้วย TextField TextArea Checkbox CheckboxList Radio RadioList Password File Hidden DropdownList ส่งค่าไปยัง Controller โดยผ่าน Form ทดสอบทำโปรแกรมบวกเลขอย่างง่าย ปิดท้ายบท

24 25 28 29 30 31 32 32 33 34 35 36 38 40

บทที่ 4 Session Cookie และ Template ก่อนเข้าเนื้อหา รู้จักกับ Session และ Cookie Session ใน yii Cookie ใน yii รู้จักกับระบบ Template การโหลดส่วนต่าง ๆ เข้ามาใน Template ติดต่อกับ CSS ภายนอก การใช้งานกับ JavaScript จากภายนอก ปิดท้ายบท

41 41 41 43 44 48 50 54 56

บทที่ 5 Database Programming ก่อนเข้าเนื้อหา

57


จุดเด่นของ Yii ด้าน Database ORM Database Components ติดต่อกับฐานข้อมูล MySQL ดึงข้อมูลมาแสดงบน CGridView ดึงข้อมูลมาแสดงบน CListView CActiveForm กับการ INSERT DATA CActiveForm กับการ UPDATE DATA CGridView กับการ DELETE DATA ปิดท้ายบท

57 58 58 59 60 65 69 72 76 78

บทที่ 6 Advanced Database Programming ก่อนเข้าเนื้อหา รู้จักกับ CPageSize ใช้งาน Csort กรองข้อมูลด้วย Ccriteria การค้นด้วย LIKE การค้นหาด้วย Function พิเศษ การแทรกภาพลง CGridView ปิดท้ายบท

79 79 82 84 87 89 91 95

บทที่ 7 Tip & ORM ก่อนเข้าเนื้อหา การทำ Filter ให้กับ CGridView การทำกล่องค้นหาภายนอก CGridView การใส่เงื่อนไขปุ่มกดให้กับ CGridView การทำ Checkbox ลง CGridView การทำ RadioButton ลง CGridView

96 97 102 106 111 115


Data Validation เชื่อมความสัมพันธ์กับตารางอื่น ๆ การเชื่อมแบบ BELONGS_TO การเชื่อมแบบ HAS_MANY ปิดท้ายบท

118 121 121 126 129

บทที่ 8 Workshop ระบบซ่อมบำรุงคอมพิวเตอร์ iService ก่อนเข้าเนื้อหา ที่มาของระบบ iService รายละเอียดของระบบ ออกแบบฐานข้อมูล เริ่มต้นสร้าง Project สร้าง Components ทำระบบ Login ระบบจัดการข้อมูลพื้นฐาน จัดการข้อมูลประเภทงานซ่อม จัดการประเภทงานโปรเจค จัดการประเภทวัสดุ/อุปกรณ์ จัดการผู้ใช้ระบบ หน้าหลัก ประวัติรายการแจ้งซ่อม ระบบทะเบียนอุปกรณ์ ระบบรับเรื่องที่แจ้งเข้ามา ส่วนของการรับซ่อม/ตรวจสอบ ระบบปิดงานซ่อมเสร็จ ส่วนของระบบรายงาน ปิดท้ายบท

130 130 131 132 134 141 144 148 160 169 175 183 195 210 219 225 232 241 249 254


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

ก่อนเข้าเนื้อหา เชื่อว่าหลายต่อหลายคนก็คงอยากจะทำงานให้เสร็จโดยไวที่สุด และ เขียนโค้ดให้น้อย ๆ แก้ไขง่าย แถมยังไม่พอ เราก็อยากให้ผลงานที่ออกมานั้น ดูดี เสมือนว่าสร้างจากมืออาชีพ แม้ว่าเราจะมืออาชีพหรือไม่ก็ตาม เอาล่ะ ครับ หลายต่อหลายคนก็พยายามค้นหาหนทางกันมายาวนานหลายสิบปีแล้ว กระทั่งได้มีการคิดค้นสร้างชุดคำสั่งสำเร็จรูปไว้ เรียกกันแบบสั้น ๆ เลยว่า Library ครับ แต่เมื่อวันเวลาผ่านไปอีกก็ยิ่งน่าปวดหัวมากขึ้น เพราะ มันมีหลายเจ้าเสียเหลือเกิน แถมแต่ละเจ้าก็ไม่ครบถ้วนต่อการใช้งานจริง ๆ สุดท้ายไม่พ้นมือตัวเองต้องมาสร้างขึ้นมาเอง เหนื่อยคูณสองเลยครับ ในยุคปัจจุบันปฏิเสธไม่ได้เลยว่าการแข่งขันนั้นสูงมาก โดยเฉพาะใน วงการการเขียนโปรแกรมทางด้าน Web Programming นอกจากจะต้องเก่งใน ภาษา PHP แล้วก็ยังต้องชำนาญตัวอื่น ๆ อีกอาทิเช่น CSS, JQuery, Web Design แถมยังไม่พอ ยังต้องไปเก่งในด้านการออกแบบฐานข้อมูลอีกต่างหาก เพราะข้อมูลบนเว็บนั้นมีปริมาณมหาศาลมาก ๆ

อะไรคือ Yii Framework นั่นล่ะครับ คือคำถามที่ผมควรตอบ และอธิบายให้กระจ่างชัด ว่ามัน คืออะไรกันแน่ หลังจากที่เราก็ได้ยิน ได้ฟังมาแล้วจากหลายสำนัก จริงบ้าง เท็จบ้าง ก็ไม่สามารถจะรู้ได้ เอาล่ะครับผมสรุปแบบภาษาง่าย ๆ เลย Yii Framework ก็คือชุดคำสั่งสำเร็จรูปตัวหนึ่งที่มาด้วยความเพียบพร้อมในการ ใช้งานทุกด้าน (ไม่ต้องหาอะไรมาเสริมอีกเลย) ซึ่งช่วยลดเวลาในการเขียนโค้ดลงได้มากมายกว่า 80% เลยทีเดียว ทำให้เราปิดงานชิ้นนึงได้ในเวลาแค่ไม่กี่วัน (เราจะได้มีเวลาไปพักผ่อน ออก กำลังกาย) แถมยังไม่พอ Yii ยังช่วยจัดการเรื่องของหน่วยความจำ และการ ทำ Cache ระดับต่าง ๆ ให้อีก ซึ่งทำให้เว็บของเราไม่อืดครับ ถึงแม้จะเติบโต 1


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

ขึ้นมาขนาดไหนก็ตาม อันนี้ผมชอบมาก เพราะปกติเราเขียนโปรแกรมก็มักจะ คำนึงถึงเรื่องความเร็วเป็นหลัก แต่พอใช้ Yii ไม่ต้องคิดเลย เขาจัดการให้ เรียบร้อยทุกอย่าง ต่อมาอีกครับ Yii Framework คือของฟรี ที่เอามาใช้ได้เลยฟรี ๆ ไม่ ต้องซื้อหา และไม่ผิดกฎหมายหากนำมาใช้ในทางธุรกิจ แล้วที่เจ๋งแบบสุด ๆ ที่ผมชอบมากเลยนั่นคือรองรับกับโฮสทั่วไปได้ทันที ไม่ต้อง conag อะไรให้ วุ่นวาย ซึ่งเราจะเห็นว่าหลาย Framework มักมีปัญหากับโฮสที่เราเช่าไว้ กว่า จะเห็นปัญหาก็โน่นเลยครับ เราทำงานเสร็จและใช้มันไประดับหนึ่งแล้ว ปัญหาถึงจะโผล่มา ซึ่งเมื่อถึงเวลานั้นเราก็ทำอะไรไม่ได้เลย นอกจากย้ายโฮส จะว่าไปแล้ว Yii คือเพื่อนสนิทคนหนึ่งของ Web Programmer เลยก็ว่า ได้ เพราะช่วยลดภาระเราได้มากมายจริง ๆ แถมยังทำให้เรามีรายได้มากขึ้น ปิดงานได้ไวขึ้น ผลงานอลังการปานมืออาชีพทำเอง

ทำไมเราต้องเขียนด้วย Framework เป็นอีกคำถามที่น่าตอบมากครับ ว่าทำไมเราต้องเลือกใช้ Framework ในการเขียนโปรแกรมก็ในเมื่อเราเขียนแบบปกติ PHP ธรรมดาที่ใช้กันอยู่มันก็ รันได้นี่นา เขาก็ทำกันเยอะแยะไม่เห็นมีใครเสียชีวิตเลยซักคน แต่การที่เรายัง “ทน” เขียนอยู่ได้ทุกวัน แล้วเราก็พอใจ ปลื้มปิติกับ การเขียนโค้ดทั้งวันเช้ายันค่ำ เดือนละ 20 วัน แลกกับผลงานที่ได้มาเพียง น้อยนิด มันจะคุ้มกันหรือครับ วันเวลาของเรามีค่ากว่านั้น สุขภาพของเราก็มี ค่าไม่น้อยไปกว่ากันเลย ดังนั้นผมขอเสนออีกทางเลือก หันมาใช้ Framework กันแล้วเราจะทำงานน้อยลง เหนื่อยน้อยลง โค้ดเขียนเป็นระบบมากขึ้น แล้วที่น่าสนใจมากก็คือ สามารถทำงานเป็นทีมได้ แม้ว่าจะเขียนโค้ด กันหลายคน แต่ลายมือของแต่ละคนจะไม่ต่างกันมาก สามารถอ่านออก และ แก้งานกันได้ถึงแม้คนนั้นจะมีอันเป็นไปแล้วก็ตาม (อาทิ ลาออก ป่วย หรือ 2


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

เสียชีวิต) แบบนี้ดีไม่น้อยเลยใช่ไหมครับ เราอย่ารอช้ากันอีกเลย ทุกวันนี้ใคร ก็หันมาเขียนระบบด้วย Framework กันมากแล้ว เทคโนโลยีมันไปไวมาก ๆ จนเราแทบไม่มีเวลาได้วิ่งตาม ดังนั้น เลือกสิ่งที่ดี แล้วเดินไปให้ถึงเป้าหมาย เราดีกว่า

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

นอกจากความเร็วที่เหลือเชื่อแล้ว การสร้างงานก็ไวมาก ๆ ครับเขียน โค้ดไม่มากแต่ได้ผลที่เกินคาดหมายเลยล่ะ แล้วอีกอย่างหนึ่งที่ Yii ได้รับ 3


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

ความนิยมสูงสุดก็คือว่า เขียนง่าย ยืดหยุ่น มีทุกอย่างมาพร้อมใช้งานทันที ไม่ ต้องหามาเพิ่มอีก และรองรับกับโฮสทั่วไปได้ทันทีไม่ต้องคอนฟิกอะไรให้ วุ่นวาย และไม่ต้องเปิด mod_rewrite ด้วย ซึ่งใน Framework อื่น ๆ จะต้อง เปิดก่อน ทำให้เกิดปัญหากันมาก แถมยังต้องไปแก้ไข .htaccess อีก เล่นเอา วุ่นกันเลยทีเดียวครับ

ทำไมต้องเป็น หนังสือเล่มนี้ ใคร ๆ ก็อยากอ่านหนังสือที่เขียนโดยคนมีประสบการณ์ตรง ใช่ไหม ครับ ผมเองก็เช่นกัน ในการที่จะซื้อหนังสือสักเล่มหนึ่งนั้น ผมต้องการ “อ่าน” แล้วสามารถนำความรู้นี้ไปใช้สร้าง “ผลงาน” ได้ทันที อะไรที่มันไม่ จำเป็นต้องรู้ก็อย่ามาเขียนให้ผมอ่าน หรืออะไรที่มันรู้เยอะเกินไปยังไม่ได้ใช้ใน ตอนนี้แน่ ๆ ก็อย่าเพิ่งเขียน แล้วที่สำคัญเลย ผมต้องการหนังสือที่ปูพื้นกันตั้งแต่คนไม่รู้อะไรเลย จริง ๆ ให้สามารถทำตามได้ รันได้ อธิบายแบบง่าย ๆ พูดเรื่องยากให้มันง่าย นั่นล่ะครับที่ผมต้องการ หนังสือแบบที่ผมต้องการ และแบบที่คุณต้องการ มันอยู่ในมือคุณเรียบร้อยแล้ว นั่นคือหนังสือเล่มนี้นั่นเอง ผมไม่ได้ไปอ่านตำรามาหลายเล่ม แล้วแปลเขามาพูด “แต่ทว่า” ผมได้ ใช้ Yii Framework สร้างผลงานแล้วหลายงาน ผ่านการทดลองผิดถูก มา สารพัดกว่า 1 ปีถึงได้นำเอาความรู้มาสรุปกลายเป็นหนังสือเล่มนี้ ดังนั้นผม จึงถ่ายทอดเฉพาะสิ่งที่ “ต้องรู้จริง ๆ และจำเป็นจริง ๆ “ เท่านั้น ซึ่งช่วย ทำให้ผู้อ่านประหยัดเวลาไปได้มาก ในการเริ่มต้นใช้งาน Yii โดยเฉพาะกับคน ที่ยังไม่เคยใช้งาน Framework ใดๆ มาก่อน ก็สามารถอ่านเล่มนี้ได้เลยครับ เพราะว่าไปแบบ Step by Step จริง ๆ และที่สำคัญมากคือไม่มีศัพท์แสง ตัวย่อสารพัด มาทำให้ปวดหัว เพราะผมได้ตัดเอาความเป็น “นักวิชาการ” ออกไปจากหนังสือเล่มนี้จนหมด 4


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

สิ้นแล้ว เราอ่าน เราศึกษา ก็เพื่อนำไปใช้สร้างชิ้นงาน ไม่ใช่ให้รู้ศัพท์ไปคุยข่ม คนอื่น จริงไหมครับ

จุดเด่น จุดเด่นของ Yii Framework มีหลายข้อมาก ซึ่งในทีนี้ก็คงเขียนไม่หมด แต่จะเขียนมาบางส่วนที่มันเด่นจริง ๆ นะครับ 1. มี CRUD Generator สร้างฟอร์มให้เราเสร็จเรียบร้อย 2. ทำ Cache ให้อัตโนมัติ ทำให้เว็บเร็ว แรง 3. ORM ฉลาดมาก ทำให้การเขียนด้านฐานข้อมูล สบายเลย 4. มี Component ด้านฐานข้อมูล ครบครัน 5. มี Component เสริมให้โหลดได้ฟรี มากมายมหาศาล และใช้ง่าย 6. เป็น MVC ที่ชัดเจน ยืดหยุ่นมาก 7. ระบบ Auto Load ทำให้มองเห็น class ทุกอย่างได้เลย ไม่ต้องสั่ง load 8. ติดตั้งง่าย ไม่ต้อง conag เยอะ 9. ฟรี ใช้ในการทำธุรกิจได้ ไม่ผิดกฎหมายแต่อย่างใด 10. มีการพัฒนาต่อเนื่อง 11. เวลาติดปัญหา ก็ค้นหาได้ง่ายดายมาก เพราะคนใช้เยอะ 12. เอกสารละเอียด ชัดเจน บอกกันทุก method เลย 13. ฯลฯ

ความรู้ที่ต้องเตรียมมาก่อน ก่อนที่จะเขียน yii framework นั้นอยากให้ตระเตรียมตัวเองในเรื่อง ต่าง ๆ ซึ่งเป็นพื้นฐานที่จะทำให้เข้าใจได้อย่างรวดเร็ว ประกอบไปด้วย 1. PHP Basic 2. OOP Basic 3. Array 5


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

ขอเน้นเพียงเท่านี้ครับ ไม่ต้องรู้อะไรมากมาย เพราะ Yii นั้นก็ใช้หลัก การเขียนโค้ดของ PHP อยู่แล้ว เพียงแต่ว่าเราเติมส่วนของ OOP เข้ามาอีกนิด เดียว เพียงแต่ขอเน้น Array หนักหน่อยนะครับ เพราะต้องใช้กันเยอะพอ สมควร แต่ก็ไม่ยากนัก เพราะผมได้พาทำไปทีละขั้นตอน

เริ่มต้นดาวโหลด ไปที่เว็บ yiiframework.com

เมื่อทำการโหลดมาเก็บไว้ในเครื่องแล้วจะได้เป็นไฟล์ดังนี้ ทำการแตกไฟล์ แล้วจะได้เป็น โฟลเดอร์ เปิดดูข้างในโฟลเดอร์จะพบโครงสร้างดังนี้

6


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

เริ่มติดตั้ง ขั้นตอนต่อมาก็คือการติดตั้ง yii framework ลงในเครื่องของเรา เชื่อ ว่าตอนนี้หลายคนก็ลง Appserv ไว้แล้วเรียบร้อย ถ้ายังไม่ลงก็ลงไว้นะครับ (ขออนุญาตไม่กล่าวถึงการติดตั้ง Appserv) เริ่มจากทำการ copy โฟลเดอร์หลัก ๆ ดังนี้

จากนั้นไปที่ D:/Appserv/www/ สร้าง folder ขึ้นมาชื่อ myweb (Appserv เครื่องผมลงไว้ที่ Drive D นะครับ ส่วนคนอื่น ๆ ก็ตามปกติเลยคือ Drive C)

ทำการวางไฟล์ลงไป

7


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

เปิด cmd ขึ้นมาแล้วพิมพ์คำสั่งดังนี้

กด Enter แล้วตอบ yes

จะพบกับหน้าจอดังนี้

8


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

จบสิ้นขั้นตอนการสร้าง Project แล้วต่อไปคือการเขียนโค้ดเพื่อแสดงข้อความ Hello World ทำการทดสอบโดยพิมพ์ http://localhost/myweb/app

Hello World ขั้นตอนนี้จะเป็นการเขียนโค้ดเพื่อให้แสดงข้อความ Hello World ออก ทางจอภาพแบบง่าย ๆ กันครับ ก่อนอื่นเลยให้เราเปิดไฟล์ SiteController.php ตามพาธ ดังนี้

เขียนโค้ดเพิ่มเข้าไปอีก 1 function ดังนี้ /app/protected/controllers/SiteController.php

9


Yii Framework : บทที่ 1 แนะนำำสู่ Yii Framework www.javathailand.com

จุดสังเกต • ชื่อของฟังก์ชั่นจะขึ้นต้นด้วยคำว่า action เสมอ ทดสอบการทำงาน

จุดสังเกต • พิมพ์ index.php?r=[ControllerName]/[ActionName] เช่น index.php? r=Site/Hello

ปิดท้ายบท ตลอดเนื้อหาในบทนี้ก็คงได้เห็นแล้วว่า yii นั้นติดตั้งง่ายมาก ไม่ได้ซับ ซ้อนอะไรเลย เพียงแค่มีการเขียน command line ครั้งเดียวตอนสร้าง project เท่านั้นครับ จากนั้นก็ไม่ได้ทำอะไรกับ command line แล้ว หลายคนก็คงเห็น อีกว่า url ดูเข้าใจง่าย เพราะเรามองเห็นได้เลยว่าโค้ดที่ทำงานนี้คือ controller/action อะไร สำหรับเนื้อหาบทนี้ก็เป็นเพียงน้ำจิ้มเล็ก ๆ น้อย ๆ เดี๋ยวในบทถัดไปจะ ได้ลงลึก และทำความเข้าใจกับส่วนต่าง ๆ กันครับ 10


Yii Framework : บทที่ 2 MVC www.javathailand.com

ก่อนเข้าเนื้อหา สำหรับเนื้อหาบทนี้จะเป็นรายละเอียดเกี่ยวกับเรื่องของ MVC ซึ่งเป็น หัวใจหลักของ Yii Framework เลยก็ว่าได้ เพราะหากเราไม่เข้าใจเรื่อง MVC แล้วก็ยากที่จะสามารถใช้งาน Yii Frameowrk ได้อย่างเต็มประสิทธิภาพ และ อาจก่อให้เกิดโค้ดขยะ หรือบั้ก ปักเอาไว้ในงานของเราโดยที่เราไม่รู้ตัวก็เป็น ได้ นอกจากจะได้เรียนรู้พื้นฐานของ MVC แล้วก็ยังจะได้เรียนรู้การส่งค่า ไป มา ระหว่าง M-V-C ด้วยครับ ซึ่งผมจะพาส่งค่าแบบง่าย ๆ ธรรมดา เพื่อ ให้เห็นการทำงานในระดับพื้นฐานก่อน จากนั้นค่อยลงลึกเข้าไปอีก รู้จักกับ MVC สังเกตครับว่าใน yii folder จะมี protedted และในนั้นจะมี model, view, controller ดังนี้

เดี๋ยวผมขออธิบายแบบง่าย ๆ ทีละส่วนครับ model = ใช้ในการเก็บ ต้นแบบของตาราง ในฐานข้อมูล 11


Yii Framework : บทที่ 2 MVC www.javathailand.com

controller = ใช้เก็บส่วนของโค้ดที่เป็น logic การทำงาน เช่นรับ Input เข้ามา คำนวณ view = ใช้เก็บส่วนที่เป็น html code ซึ่งแสดงผลออกมาให้ผู้ใช้มองเห็นได้ ทั้งสามส่วนมีความสัมพันธ์กัน ดังภาพนี้

จะเห็นได้ว่า ทั้งสามอยู่กันแบบแยกส่วน แต่สามารถติดต่อสื่อสารกันได้ ซึ่ง เป็นอิสระต่อกันอย่างมาก ๆ ครับ (หลายคนฟังแล้วอาจงงในระยะแรก แต่ไม่ เป็นไร เพราะเมื่อได้เขียนโค้ดตามจะเห็นถึงการใช้งานแต่ละส่วนครับ) สงสัยกันไหมว่าทำไมเราต้องเขียนโค้ดแบบ MVC ในเมื่อแบบเดิมก็ เขียนกันมาได้อยู่ คำตอบก็คือว่า เร้าองการให้งานเป็นระบบ แยกส่วนชัดเจน เวลามาแก้มันก็แก้ง่าย โดยเฉพาะอย่างยิ่งเวลาต้องพัฒนาไปเรื่อย ๆ ให้ เติบโตยิ่งขึ้นมันก็ยิ่งจำเป็นครับ ดังนั้นศึกษาทำความเข้าใจ MVC ไว้มี ประโยชน์มาก

12


Yii Framework : บทที่ 2 MVC www.javathailand.com

เริ่มต้นใช้เครื่องมือเขียนโค้ดแบบมืออาชีพ NetbeansIDE สำหรับเครื่องมือที่เราจะใช้ในการเขียนโค้ดนั้นผมขอแนะนำ NetbeansIDE นะครับ เพราะว่าช่วยอำนวยความสะดวกมาก เขียนได้ทั้ง ภาษา PHP, JAVA, Groovy ในตัวเดียวได้เลย สุดยอดมาก และยังฟรีอีกด้วย ก่อนอื่นผมขอให้ไปดาวโหลดมาติดตั้งกันนะครับ โดยหาได้เลยจาก netbeans.org (ขั้นตอนการโหลดขอไม่อธิบายนะครับ) ขอให้โหลดตัวเต็มแบบ มี java runtime ในตัวเลยนะครับ เพื่อจะได้ใช้งานได้ทันทีเลย เมื่อเราเปิด โปรแกรม NetbeansIDE ขึ้นมาก็จะพบกับหน้าจอหลักดังนี้ครับ

สำหรับคนที่ไม่ได้พบหน้าจอแบบนี้ก็ไม่ต้องตกใจนะครับ เพราะในเครื่องผม ได้เปิดใช้งานมาพักหนึ่งและมีการปรับนี่ ปรับนั่นไปบ้างแล้ว ก็เลยต่างออกไป จากคนที่เพิ่งลงใหม่ ๆ

13


Yii Framework : บทที่ 2 MVC www.javathailand.com

เตรียมโปรเจค เอาล่ะครับเรามาเริ่มต้นเตรียมโปรเจคกันเลยดีกว่า ไหน ๆ เราก็สร้าง ไว้แล้วก็ใช้ตัวเดิมนี่แหละเพื่อจะได้ลดระยะเวลาในการเรียนรู้ลงไปด้วย ก่อน อื่นครับคลิกที่ File > New Project ตามภาพนี้

เลือกประเภทเป็น PHP Project

กด Next และกรอกชื่อ พร้อมกับ ที่เก็บไฟล์ ดังนี้ 14


Yii Framework : บทที่ 2 MVC www.javathailand.com

กดปุ่ม Finish แล้วดูโครงสร้าง Project เราจะพบว่ามีหน้าตาดังนี้

15


Yii Framework : บทที่ 2 MVC www.javathailand.com

function & parameter คราวนี้เราจะมาเขียนโค้ดเพื่อสร้าง function มาอีกอันหนึ่ง และมีการ รับค่า parameter เข้ามาร่วมงานด้วย ก่อนอื่นทำการสร้าง controller ขึ้นมา ใหม่

และเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter2Controller.php

16


Yii Framework : บทที่ 2 MVC www.javathailand.com

ทดสอบการทำงาน

จุดสังเกต • เราจะต้องกำหนดชื่อ class ให้มีคำว่า Controller ต่อท้ายเสมอ เช่น Chapter2Controller • class ของเราจะต้องทำการ extends จาก Controller เสมอ • หากมีการรับ parameter เข้ามาจะต้องส่งค่าให้ และชื่อตรงกับตัวแปร ทุกครั้ง เช่น $name ก็ต้องส่งเข้ามาว่า &name=[ค่าตัวแปร] เพื่อความเข้าใจมากขึ้นอีก เรามาลองทำการส่งค่าแบบ 2 parameter กันครับ เริ่มแรกเลยก็ทำการเขียน function เพิ่มอีกดังนี้ /app/protected/controllers/Chapter2Controller.php

ทดสอบการทำงาน

17


Yii Framework : บทที่ 2 MVC www.javathailand.com

การผูกเข้ากับ View ในตัวอย่างนี้จะพาเขียนโค้ดให้การทำงานของ controller เชื่อมโยงกับ view ครับ เริ่มแรกเราก็เขียน function เพิ่มเข้ามาอีกดังนี้ /app/protected/controllers/Chapter2Controller.php

ทำการสร้าง view เพิ่มอีกดังนี้

จากนั้นสร้างไฟล์ BindView.php เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter2/BindView.php

ทดสอบการทำงาน

คราวนี้มาลองส่งค่าตัวแปรออกมาทาง view ด้วยครับ ให้เราทำการสร้าง function เพิ่มอีกดังนี้ 18


Yii Framework : บทที่ 2 MVC www.javathailand.com

/app/protected/controllers/Chapter2Controller.php

สร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/ViewData.php

ทดสอบการทำงาน

19


Yii Framework : บทที่ 2 MVC www.javathailand.com

การแทรกภาพลงหน้าเว็บ ตัวอย่างนี้จะพาเขียนโค้ดเพื่อแสดงภาพออกทางหน้าเว็บ โดยปกติเรา ก็จะเขียนด้วย <img src=”…” /> ใช่ไหมครับ แต่คราวนี้เราใช้ Yii Framework ดังนั้นโค้ดก็ต้องเป็นของ Yii ครับผม วิธีการเริ่มแรกให้เราไปหาภาพสวย ๆ มาวางไว้ใน app/images/ ดังนี้

ทำการสร้าง function เพิ่มมาอีกใน controller ดังนี้ /app/protected/controllers/Chapter2Controller.php

ทำการสร้าง View

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter2/ShowImage.php

20


Yii Framework : บทที่ 2 MVC www.javathailand.com

ทดสอบการทำงาน

การส่งค่าจาก View ไปให้ Controller ตัวอย่างนี้จะพาเขียนให้ส่งค่าเข้าไปยัง Controller โดยส่งจาก View ไป วิธีการที่ง่ายที่สุดเลยครับก็คือการส่งผ่านทาง Link เดี๋ยวผมพาทำแบบค่า เดียวก่อน สร้าง function เพิ่มอีกดังนี้ /app/protected/controllers/Chapter2Controller.php

ทำการสร้าง view

21


Yii Framework : บทที่ 2 MVC www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter2/ParamFromView.php จุดสังเกต • CHtml::link ค่าแรกคือข้อความ ค่าที่สองคือ url โดยต้องป้อนเป็นแบบ array เข้าไป • ใน url ที่ส่งไปแบบ array นั้นค่าแรกคือ url target อีกค่าคือ parameter value ทดสอบการทำงาน ก่อนส่งค่า

ทดสอบการทำงาน เมื่อกดส่งค่า

22


Yii Framework : บทที่ 2 MVC www.javathailand.com

ปิดท้ายบท ในบทนี้ก็คงได้เข้าใจเรื่องการส่งค่าไปมา รวมถึงการเก็บไฟล์ไว้ใน controller, view แล้วนะครับ ผมได้ปูพื้นฐานเอาไว้ให้ก่อน เพราะในบทถัดไป เราจะค่อย ๆ เรียนรู้เรื่องที่ยากขึ้น และจะได้ใช้พื้นฐานจากตรงนี้ไปต่อยอด ครับ เนื้อหาจากนี้ไปจะยากขึ้นนิดหน่อยครับ แต่ก็ขอให้ทบทวนสองบทที่ ผ่านมาซักเล็กน้อย เพื่อให้เข้าใจการเก็บไฟล์แบบ MVC และการส่งค่าไปมา ครับ

23


Yii Framework : บทที่ 3 Form www.javathailand.com

ก่อนเข้าเนื้อหา บทนี้จะว่าด้วยเรื่องของการสร้าง Form โดยใช้ชุดคำสั่งของ Yii Framework กันครับ ซึ่งนอกจากช่วยลดโค้ดแล้วยังมีความยืดหยุ่นอย่างมาก อีกด้วย (แต่หลาย ๆ คนก็ยังเขียนด้วย HTML ปกติกันอยู)่ โดยปกติก็จะมีตัว CForm, CActiveForm สองอันครับ ในบทนี้ผมจะพาใช้ตัว CForm กันก่อน เพราะง่ายกว่า และยังไม่ต้องผูกกับ Database, Model อะไรให้ปวดหัว สำหรับคนที่ได้เขียนโค้ด HTML สร้าง Form ได้อยู่แล้วก็จะเข้าใจได้ไว หน่อย เพราะรูปแบบคำสั่งใกล้เคียงกันมากกับ Form ของ Yii

Form ของ Yii ดีอย่างไร ดีอย่างไร อันนี้บอกได้ว่าเขียนโค้ดน้อยกว่า และทำให้โค้ดเป็นระเบียบ โดยเฉพาะอย่างยิ่งการเขียนเพื่อแสดงข้อมูลในแบบของ DropdownList นั้นใช้ Yii จะเขียนน้อยมาก ๆ จนเทียบกันแล้วมองเห็นความต่างในทันที สำหรับคน ที่เคยเขียนเพื่อดึงข้อมูลจากฐานขึ้นมาใส่ DropdownList จะพบเลยว่า ต้อง เขียน loop วุ่นวายไปหมด กว่าจะได้แต่ละอันเล่นเอาเลือดตาแทบกระเด็น จริงไหมครับ และมันจะเจ๋งชิบหายเลยครับถ้าใช้ CActiveForm แต่หัวข้อนี้พาใช้ CForm ธรรมดาก่อน เพื่อให้เห็นการใช้งานในระดับเบื้องต้น ถ้าถามว่าจำเป็น ไหมที่จะต้องเรียนรู้การใช้ชุดคำสั่งเหล่านี้เพื่อสร้าง Form ตอบได้เลยว่า จำเป็นเมื่อต้องการเขียนในระดับสูง เงื่อนไขยาก ๆ เพราะช่วยส่งค่าตัวแปร เข้าไป เปลี่ยนค่าของ component ได้ง่ายกว่าเขียนแบบ html ธรรมดา

24


Yii Framework : บทที่ 3 Form www.javathailand.com

เริ่มต้นสร้าง Form อย่างง่ายด้วย TextField ด้วยความสามารถที่ Yii นั้นทำการ Auto Load ทุกอย่างมาไว้พร้อมใช้ งานได้เลยดังนั้นเราก็เพียงแค่เขียนใช้งาน ก็ใช้ได้ทันทีไม่ต้องกำหนดค่าอะไร ให้ปวดหัว เริ่มต้นก็ทำการสร้าง Controller มาใหม่อีกดังนี้

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

25


Yii Framework : บทที่ 3 Form www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter3/Index.php

ทดสอบการทำงาน

26


Yii Framework : บทที่ 3 Form www.javathailand.com

จุดสังเกต • ใช้ CHtml:: ตามด้วยชื่อของ component เช่น CHtml::textField(name, value, htmlOptions) ตัวอย่างนี้จะพาปรับแต่งขนาดของ TextBox กัน ซึ่งเราก็สามารถทำได้โดย ง่ายมาก เพราะ Yii ได้เตรียม parameter ไว้ให้แล้วครับ ก่อนอื่นสร้าง function เพิ่มอีก /app/protected/controllers/Chapter3Controller.php

สร้าง view

เขียนโค้ดลงไป /app/protected/views/Chapter3/TextFieldCustomize.php

27


Yii Framework : บทที่ 3 Form www.javathailand.com

ทดสอบการทำงาน

จะเห็นว่าเราสามารถปรับแต่งขนาดได้ และค่าอื่น ๆ ก็ทำได้เช่นกัน เพราะ parameter ที่ 3 ก็คือ html attribute ของ tag นี้เองครับ

TextArea ในการใช้งาน textarea นั้นเหมือนกันเลยกับการใช้งาน text\eld ต่าง กันแค่ชื่อเท่านั้น เดี๋ยวจะพาใช้แบบง่าย ๆ กันครับ อันดับแรกทำการสร้าง function เพิ่มมาอีกดังนี้ /app/protected/controllers/Chapter3Controller.php

ผมไม่อยากพาสร้าง view เพื่อให้วุ่นวายหลายไฟล์ครับ ก็เลยเอาแบบนี้แล้ว กัน เขียนจบมันใน Controller เลย ฮ่า ๆ ๆ ว่าแล้วก็ทำการทดสอบเลยครับ

28


Yii Framework : บทที่ 3 Form www.javathailand.com

Checkbox หัวข้อนี้จะพาใช้งาน Checkbox นะครับ วิธีการก็ไม่ยาก เริ่มแรกสร้าง function เพิ่มมาอีกอัน เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

29


Yii Framework : บทที่ 3 Form www.javathailand.com

CheckboxList เป็นอีกตัวอย่างที่มีประโยชน์มากและเราก็ไม่มีวันหนีพ้นมันไปได้ครับ เพราะปกติแล้วเวลาทำระบบด้านฐานข้อมูลก็หนีไม่พ้นเรื่องการนำรายการ มาแสดงในรูปแบบ Checkbox และหากจะมาเขียน loop แสดงทีละตัวผมว่า งานนี้ได้หืดขึ้นคอแน่ ๆ ดังนั้นทาง yii เขาก็เลยสร้างชุด component มาให้ใช้ ครับ เพื่องานนี้โดยเฉพาะ เริ่มต้นก็สร้าง function เพิ่มเข้ามาอีก เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

30


Yii Framework : บทที่ 3 Form www.javathailand.com

Radio ก็คงไม่ต้องอธิบายอะไรให้ยืดยาวนะครับ เพราะเราก็รู้จักกันอยู่แล้ว ว่าอะไรคือ radio เริ่มกันเลยดีกว่าครับ ให้ทำการสร้าง function และเขียน โค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

31


Yii Framework : บทที่ 3 Form www.javathailand.com

RadioList คล้ายกับ CheckboxList ครับต่างกันก็เพียงแค่ว่าเลือกได้รายการเดียว เท่านั้นเอง เรามาเริ่มกันเลย ให้สร้าง function ขึ้นมาและเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

Password ทำการสร้าง function เพิ่มเข้ามาอีก และเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

32


Yii Framework : บทที่ 3 Form www.javathailand.com

ผลการทำงาน

File ในกรณีที่ต้องการ upload \le ต่าง ๆ ขึ้นสู่ server เราก็จะใช้ component ตัวนี้ครับ เริ่มแรกทำการสร้าง function เพิ่มเข้ามาอีก และเขียน โค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

33


Yii Framework : บทที่ 3 Form www.javathailand.com

Hidden ใช้ในการซ่อนข้อมูลเพื่อส่งไปยัง controller โดยมองไม่เห็นหน้าตาของ component ก่อนอื่นทำการสร้าง function และเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

เมื่อคลิกดูโค้ดจะพบว่ามี tag hidden

34


Yii Framework : บทที่ 3 Form www.javathailand.com

DropDownList เป็นการสร้าง <select>…</select> เพื่อให้ผู้ใช้เลือกรายการได้อย่าง ง่ายดาย โดยเฉพาะใน yii ได้มี component ไว้ให้เราเรียบร้อย ใช้ง่ายมากครับ มาเริ่มกันเลยดีกว่าทำการสร้าง function มาอีกและเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ผลการทำงาน

35


Yii Framework : บทที่ 3 Form www.javathailand.com

การส่งค่าไปยัง Controller โดยผ่าน Form ในหัวข้อนี้จะพาสร้าง Form และส่งค่าเข้าไปยัง Controller กันครับ ซึ่ง ก็จะใช้ไฟล์หลายไฟล์เพราะต้องมีทั้ง View – Controller ด้วย เอาล่ะ ก่อนอื่น สร้าง function และเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/Chapter3/Form.php

36


Yii Framework : บทที่ 3 Form www.javathailand.com

ทดสอบการทำงาน

เมื่อส่งค่าแล้ว

37


Yii Framework : บทที่ 3 Form www.javathailand.com

ทดสอบทำโปรแกรมบวกเลขอย่างง่าย ตัวอย่างนี้จะพาทำโปรแกรมบวกเลขแบบง่าย ๆ กันครับ เอาแค่ส่งค่า ไปแล้วรวมกันได้ก็พอ เพื่อให้เห็นแนวทางในการรับส่งค่าจาก Form เริ่มแรก ครับก็ทำการสร้าง function และเขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter3Controller.php

ทำการสร้าง view

38


Yii Framework : บทที่ 3 Form www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter3/Cal.php

ผลการทำงานก่อนส่งค่า

ผลการทำงานเมื่อส่งค่าแล้ว

39


Yii Framework : บทที่ 3 Form www.javathailand.com

ปิดท้ายบท ตลอดบทนี้ก็คงได้เห็นแล้วว่าการสร้าง Form และส่งค่าไปมานั้น สำหรับ yii framework สามารถทำได้อย่างง่ายดายมาก และยืดหยุ่นสามารถ ที่จะปรับแต่งรูปแบบต่าง ๆ ได้ตามต้องการเลย โดยไม่ต้องใช้ HTML Tag เลย ก็ได้ อยากขอให้ทบทวนเรื่องการรับส่งค่าให้มาก ๆ ครับเพราะมีประโยชน์ มาก และจะได้ใช้อย่างแน่นอนในบทถัดไป โดยเฉพาะอย่างยิ่งเรื่องของการ เขียนโปรแกรมทางด้านระบบฐานข้อมูล เราจะหลีกเลี่ยงการใช้งาน Form ไม ได้เลย สุดท้ายก่อนจากกันในบทนี้ ผมมีทิปเล็ก ๆ มาฝากครับ เมื่อเราใช้ NetbeasnIDE เขียนโค้ด เวลาที่เราพิมพ์ CHtml::textField( มันก็จะมีตัวเลือก มาให้เรา พร้อมคำอธิบาย ตรงนี้เองเราก็สามารถอ่านและทำความเข้าใจได้ ว่าแต่ละค่าที่ต้องป้อนเข้าไปนั้นคืออะไร

40


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ก่อนเข้าเนื้อหา ในเนื้อหาบทนี้ก็จะเป็นเรื่องของ Session, Cookie, และระบบ Template ครับโดยผมจะเน้นมากในเรื่องของ Template เพราะจำเป็นอย่างยิ่ง ชนิดที่ว่าหลีกเลี่ยงไม่ได้เลย ส่วน Session, Cookie นั้นก็จะพาใช้เท่าที่จำเป็น ต้องรู้ก่อน สำหรับ method อื่น ๆ ก็สามารถเรียนรู้เพิ่มเติมได้อีกทีจากคู่มือ ของ yii framework ตลอดเรื่องราวในบทนี้ก็จะเป็นเรื่องเบา ๆ ไม่เครียดครับ และเนื้อหา ไม่ได้ลำดับต่อเนื่องกัน ผู้อ่านสามารถจะข้ามไปอ่านหัวข้อไหนก่อนก็ได้ เพราะว่าเป็นคนละเรื่องกัน

รู้จักกับ Session และ Cookie จะว่าไปแล้ว Session และ Cookie ทั้งสองมีความเหมือนกันคือใช้ใน การเก็บค่าไว้ในหน่วยความจำของเครื่องคอมพิวเตอร์ แต่ต่างกันตรงที่ Session เก็บไว้ใน ram แต่ Cookie เก็บไว้ในไฟล์ และไฟล์นี้ก็จะอยู่บนเครื่อง client อีกด้วย แถมยังไม่พอ Cookie ยังเก็บได้ไม่มากนักหากข้อมูลมีปริมาณ มหาศาล ก็ไม่สามารถเก็บลงได้ ดังนั้นเราควรเลือกใช้ให้เหมาะสมกับ สถานการณ์ คนที่เคยเขียน PHP มาก่อนหน้านี้ก็คงรู้อยู่แล้วว่าอะไรคือ Session อะไรคือ Cookie ดังนั้นผมจึงไม่ขออธิบายลงลึกนะครับ

Session ใน yii วิธีการใช้งานจะแตกต่างไปจาก PHP ธรรมดา เพราะว่าทุกอย่างใน yii นี้เราจะต้องใช้ชุดคำสั่งของเขาแบบเต็ม ๆ เลย แต่นั่นไม่ใช่ปัญหาครับเพราะ เราก็แค่เรียนรู้รูปแบบคำสั่งเท่านั้นเอง ที่เหลือก็ไอเดียเหมือนเดิมเป้ะ ลองมา ดูกันเลยว่าใช้อย่างไร เริ่มต้นก็สร้าง controller ขึ้นมา 41


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter4Controller.php

สร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter4/Session.php 42


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ผลการทำงาน

Cookie ใน yii ตัวอย่างนี้จะพาสร้าง cookie และทำการอ่านค่ามาแสดงผลแบบง่าย ๆ ครับ เริ่มแรกก็สร้าง function เพิ่มมาอีก และเขียนโค้ดลงไปดังนี้ /app/protected/classes/Chapter4Controller.php

สร้าง view

43


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter4/Cookie.php

ผลการทำงาน

รู้จักกับระบบ Template ไม่ว่าคุณจะเป็นมือใหม่ที่หัดเขียนเว็บด้วย Framework หรือเป็นมือ โปรที่ใช้ Frameowrk มาอย่างช่ำชองแล้วก็ตาม คำว่า Template คุณก็คงได้ พบเห็นอยู่รอบตัวแทบทุกเวลา ไม่ว่าจะเข้าไปเว็บแห่งไหนก็ตาม ทำไมน่ะเหรอครับ เพราะโดยปกติแล้วหัวเว็บ และเมนู ซ้าย ขวา ล่าง จะคงอยู่เสมอ ที่เปลี่ยนไปก็มีเพียงส่วนของเนื้อหาหลักเท่านั้น ในยุคสมัยก่อน โน้นที่เราเขียนโค้ดด้วย PHP ธรรมดาการสร้าง template เป็นเรื่องยุ่งยาก ซับ ซ้อนมาก บางคนก็ใช้การ include เอา บางคนก็ทำการสร้าง class แล้ว extends มาจาก base class บางคนก็สร้าง function ไว้เอง แต่ก็นั่นแหละ ยิ่ง หลายคนก็ยิ่งหลายสำนัก ทำให้โค้ดเปรอะเปื้อนจนไม่สามารถจินตนาการได้ เลยว่า หน้าตาจะออกมาแบบไหนกันแน่

44


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

yii framework มีระบบ template ให้ใช้ทันที จุดเด่นที่เหนือกว่า framework อื่น ๆ ในเรื่องนี้ก็คือใช้งานง่าย และยืดหยุ่นมาก มาถึงก็ใช้งานได้ ทันทีไม่ต้องทำการ extends หรือไป con\g อะไรให้วุ่นวาย ว่าแล้วเราก็มาเริ่ม กันเลยดีกว่าครับ ก่อนอื่นทำการสร้าง function เพิ่มเข้ามาอีกและเขียนโค้ด ลงไปดังนี้ /app/protected/controllers/Chapter4Controller.php

ทำการแก้ไขไฟล์ template ดังนี้

/app/protected/views/layouts/main.php

45


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ทำการสร้าง view มาอีก 3 \le

เขียนโค้ดลงไปแต่ละไฟล์ดังนี้ /app/protected/views/Chapter4/PageA.php Data on Page A /app/protected/views/Chapter4/PageB.php Data on Page B /app/protected/views/Chapter4/Template.php

46


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ผลการทำงาน

เมื่อคลิกเมนู Page A

เมื่อคลิกเมนู Page B

47


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

การโหลดส่วนต่าง ๆ เข้ามาใน Template หัวข้อนี้จะเป็นการ load เอาส่วนต่าง ๆ มาวางบน template ครับ ได้แก่เมนูด้านซ้าย และเมนูด้านขวา ดังนั้นก่อนอื่นเราก็ทำการสร้าง view มา อีก 2 อันดังนี้

เขียนโค้ดลงในแต่ละไฟล์ดังนี้ /app/protected/views/layouts/menu_left.php

/app/protected/views/layouts/menu_right.php

48


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

จากนั้นก็แก้โค้ดใน main.php ให้เป็นดังนี้ /app/protected/views/layouts/main.php

49


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

จุดสังเกต • การใช้ $this->beginContent(\le_name) คือการโหลดไฟล์มาวางตรง นี้ครับ • การใช้ $this->endContent() คือเป็นการจบการโหลดไฟล์มาวาง • ไม่ต้องระบุนามสกุลไฟล์ ให้บอกเพียงชื่อไฟล์ก็พอ ติดต่อกับ CSS ภายนอก ในการเชื่อมโยงกับ CSS File นั้นเราต้องรู้ว่าเก็บไฟล์ไว้ไหน และเรียก ใช้อย่างไร เพราะใน yii framework ไม่อนุญาตให้วางได้ตามใจชอบ ดังนั้นผม เลยเขียนหัวข้อนี้ขึ้นมา เพราะมันจำเป็นจริง ๆ ไม่ว่าคุณจะทำเว็บอะไรในโลก นี้ก็แทบหนีไม่พ้น CSS เลยครับ ที่เก็บไฟล์ .css 50


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ทำการสร้าง style.css ของเราขึ้นมาครับ

เขียนโค้ดลงไปดังนี้ /app/css/style.css

51


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

แก้ไข template.php

/app/protected/views/layouts/main.php

52


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

53


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ผลการทำงาน

การใช้งานกับ javascript จากภายนอก หัวข้อนี้ก็จะเหมือนกันกับเรื่องการใช้งาน CSS File จากภายนอกครับ เพียงแต่เปลี่ยนมาเป็น JavaScript File เท่านั้นเอง เริ่มแรกเราก็ทำการสร้าง folder ชื่อ js และสร้าง Java Script File เก็บไว้ดังนี้

เขียนโค้ดลงไป /app/js/myscript.js

54


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

แก้ไขโค้ดเล็กน้อยใน template

โค้ดที่แก้ไข /app/protected/views/layouts/main.php

ทดสอบการทำงาน

55


Yii Framework : บทที่ 4 Session Cookie และ Template www.javathailand.com

ปิดท้ายบท ตลอดเนื้อหาในบทนี้ผู้อ่านก็ได้เห็นแล้วว่าเราสามารถใช้งาน Session, Cookie, และสร้าง Template ได้ด้วย แถมยังสามารถที่จะเชื่อมโยงการใช้งาน กับ CSS, JavaScript จากภายนอกได้อีกด้วย เพียงแต่ขอให้เราเขียนโค้ดด้วย Class ของ Yii Framework และเก็บไฟล์ไว้เป็นที่เป็นทาง ตามที่ทาง yii ได้ กำหนดเอาไว้ เท่านี้ก็สามารถใช้งานได้แล้วครับ ไม่ยุ่งยากเลยใช่ไหม เอาล่ะครับ โดยพื้นฐานแล้วก็คงมีเพียงเท่านี้ สำหรับเนื้อหาจากนี้ไป จะเป็นเรื่องที่หนักขึ้น แต่มีประโยชน์มาก ๆ นั่นคือเรื่องของ Yii & Database Programming ครับ ดังนั้นขอให้ทบทวนเรื่องของ MVC ให้ชัดเลย เพราะยังไง ก็ต้องได้เจอแบบหนัก ๆ ในเนื้อหาบทต่อไป และหวังว่า เมื่อผู้อ่านได้อ่าน หนังสือเล่มนี้จบแล้วคงพูดเป็นเสียงเดียวกันว่า “ Yii Framework สุดยอดมาก ๆ“

56


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ก่อนเข้าเนื้อหา เอาล่ะครับ สำหรับเนื้อหาบทนี้ก็จะหนักหน่อย เพราะเป็นเรื่องการ เขียนโปรแกรมด้านฐานข้อมูลเต็ม ๆ กันเลย แถมยังไม่ได้ใช้คำสั่ง SQL เลย แม้แต่บรรทัดเดียว ขอให้ลืมมันไปครับกับสิ่งที่เคยรู้มาก่อนหน้านี้ แล้วมา เรียนรู้ yii framework เปิดใจยอมรับการใช้งาน Component ต่าง ๆ ที่เขา สร้างให้ ตลอดเนื้อหาของบทนี้ก็คงจะเบาบ้าง หนักบ้าง ปนกันไปเรื่อย ๆ อันนี้ ก็ต้องบอกไว้ก่อนว่าที่ผมเขียนเนื้อหาบทนี้เป็นเพียงเบสิค หรือพื้นฐานมาก ๆ ครับสำหรับการใช้งาน Component เหล่านี้ ส่วนเชิงลึกจะอยู่ในบทถัดไป รับรองว่าได้ลึกถึงตับแน่นอน เมื่อเตรียมกายเตรียมใจพร้อมแล้ว ก็ลุยกันเลย !!!

จุดเด่นของ Yii ด้าน Database สิ่งที่ทำให้ผมตกหลุมรัก และใช้ Yii มาจนทุกวันนี้กับงานแทบจะทุกชิ้น ของผมนั่นก็เพราะว่า yii framework มีชุด component สำหรับงานด้าน Database อย่างครบถ้วน และใช้งานได้จริง ยืดหยุ่น ปรับแต่งได้สารพัดตาม ความต้องการจริง ๆ อันนี้ผมไม่ได้โม้เกินไปครับ หากคุณได้สัมผัสแล้วจะรู้สึก แบบผมอย่างแน่นอน นอกจากมีครบครันทั้ง CGridView, CLIstView, CDetailView, CActiveForm,… และอื่น ๆ อีกมากมายแล้วนั้น yii เองก็ยังมีชุด component อีกมากมายนับพัน ๆ ให้เราโหลดมาใช้งานได้ฟรีแบบไม่เสียค่าใช้จ่ายเลย แม้แต่บาทเดียว เจ๋งไหมล่ะครับแบบนี้ แล้วที่เด่นที่สุดจนผมต้องน้ำตาไหลก็คือชุด Component เหล่านี้ทำงาน ได้ครบถ้วนในสิ่งที่มันควรจะเป็น โดยที่เราไม่ได้ไปเขียนโค้ดจัดการกับเรื่อง เหล่านั้นเลย ไม่ว่าจะเป็นเรื่อง Pagging, Sorting, Searching และด้าน Performance ด้วย นี่คือสุดยอด Framework ที่ผมยอมรับให้เป็นเบอร์ 1 ในใจ 57


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

เลยสำหรับการนำมาใช้งานสร้างระบบด้านฐานข้อมูลบนเว็บ นอกจากใช้ เวลาน้อยนิดแล้วยังได้ประสิทธิภาพ และคุณภาพเทียบเท่ามืออาชีพทันทีเลย ทีเดียวเชียว

ORM นอกจาก yii จะมี ORM ที่เชื่อมโยงกันแล้ววิ่งทะลุไปหาข้อมูลได้แบบ ไม่จำกัดชั้นเหมือนกับ Kohana Framework แล้วนั้นก็ยังมีจุดขายอีกอย่างที่ Framework อื่น ๆ ยังทำไม่ได้(ณ เวลานี้ที่ผมกำลังเขียนหนังสือ) ก็คือการไป WHERE ยังตารางที่เชื่อมโยงกัน มันเป็นเรื่องยากมาก ๆ สำหรับกรณีนี้ หาก ใครเคยเขียน CI, Kohana, CakePHP มาก่อนจะรู้เลยว่ายากจริง ๆ ผมไม่ได้ พูดเกินเลย แต่หากคุณใช้ yii framework แล้วล่ะก็ มันก็จะกลายเป็นเรื่องหมู อย่างที่สุดทันทีเลย ORM ก็คือการสร้าง class ขึ้นมาเป็นตัวแทนของตารางในฐานข้อมูล และจากนั้นก็สามารถสร้าง object ได้ทันที และก็จะมี properties, method พร้อมใช้งานได้เลย อาทิเช่น ind, indAll(), save() เป็นต้น โดยที่เราไม่ต้องรู้ การทำงานภายใน และไม่ต้องเขียนมันขึ้นมาเลย เพียงแค่ใช้งานให้เป็น ป้อน parameter ให้ตรงก็พอแล้ว เตรียมผ้าเช็ดหน้าไว้ครับ เพราะเมื่อจบนี้แล้วคุณจะได้ “น้ำตาไหล” อย่างแน่นอน หลายคนอาจจะนั่งเขกกะโหลกตัวเองไปด้วย และด่าว่า “ ไป ทนอะไรตั้งนานวะ กับไอ้วิธีการเดิม ๆ ที่พาตัวเองลำบากมานานปี “

Database Component ในส่วนของการจัดการด้านฐานข้อมูลนั้น Yii Framework ได้มีสิ่งที่ เรียกว่า Component ไว้ให้เราใช้จัดการอย่างสมบูรณ์แล้วครับ เพียงแต่มา เรียนรู้ว่าใช้อย่างไร และแต่ละตัวนั้นเหมาะที่จะเอาไปใช้ตอนไหน เท่านั้นเอง 58


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ผมจะค่อย ๆ พาใช้งานเป็นลำดับ และยกตัวอย่างที่ใช้ง่ายที่สุดก่อน ครับ เพราะในบทถัดไปเราจะมาเจาะลึกกันอีกที

ติดต่อกับฐานข้อมูล MySQL เรามาเริ่มต้นทำการติดต่อกับฐานข้อมูลเลยครับ อันดับแรกเลยจริง ๆ ก็คือสร้างฐานข้อมูลมาก่อน ซึ่งผมได้ตั้งชื่อไว้ดังนี้

ทำการเปิดไฟล์ main.php เพื่อแก้ไข conig ค่าการเชื่อมต่อ

/app/protected/con1g/main.php

59


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ทำการแก้ไขให้เป็น /app/protected/con1g/main.php

เพียงเท่านี้ก็สามารถเชื่อมต่อกับฐานข้อมูลได้แล้วครับ แต่อย่าลืมเอา เครื่องหมาย /* */ ออกก่อนนะครับ เพื่อให้โค้ดช่วงนี้ทำงานได้ เพราะว่าเริ่ม ต้นเขาจะ comment เอาไว้

ดึงข้อมูลมาแสดงบน CGridView ก่อนอื่นขอให้ทำการสร้างตาราง มีโครงสร้างดังนี้

ทำการกรอกข้อมูลลงไปดังนี้

60


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

สร้าง model

เขียนโค้ดลงไปดังนี้ /app/protected/models/Book.php

คำอธิบาย ใน class นี้ประกอบด้วย 3 function model = ทำให้สร้าง object model ได้เพื่อใช้งานด้านฐานข้อมูล tableName = เป็นการกำหนดว่าให้ผูกเข้ากับตารางที่ชื่อ books attributeLabels = กำหนดให้รู้ว่าแต่ละ column จะให้เป็นคำว่าอะไร

61


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

สร้าง controller

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter5Controller.php

คำอธิบาย ทำการสร้าง object model ที่ชื่อว่า $model โดยการ new Book() จากนั้นตามด้วยการแปลงให้กลายเป็นชนิด CActiveDataProvider โดยมีการส่ง $model เข้าไป เพื่อให้นำไปแสดงบน CGridView ได้ และสุดท้ายเราก็ทำการ render โดยส่งตัวแปรชื่อ $books ไปด้วย และทำการผูกเข้ากับ view ที่ชื่อ CGridView

62


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

สร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter5/CGridView.php

คำอธิบาย ในส่วนนี้จะเป็นการสร้าง widget เพื่อแสดงข้อมูลในแบบของตาราง เรียกกันว่า CGridView ครับ โดยต้องทำการสร้างจาก zii.widgets.grid.CGridView จากนั้นเราก็กำหนดค่าต่าง ๆ ลงไปโดย มี dataProvider เป็นค่า $books และตามด้วยรายชื่อของ columns ที่จะนำมาแสดง ซึ่งก็มี id, name, price ตามลำดับ

63


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ลบโค้ดทั้งหมดออกจากไฟล์ js/script.js และทำการแก้ไข template ด้วย

ทำการเขียนโค้ดลงไปอีกเล็กน้อยดังนี้

ผลการทำงาน

นอกจากจะสามารถแสดงข้อมูลได้แบบง่ายดายแล้ว ก็ยังสามารถทำการ sort column ได้โดยที่เราไม่ต้องเขียนโค้ดส่วนนี้เลย และที่เจ๋งอีกข้อคือตารางนี้

64


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

แบ่งหน้าให้แล้วโดยอัตโนมัติ เพื่อทดสอบขอให้เรากรอกข้อมูลลงไปเยอะ ๆ เกิน 10 รายการแล้วทดสอบอีกรอบจะได้ผลดังนี้ครับ

จะเห็นได้ว่าข้อมูลถูกแบ่งหน้าให้แล้ว โดยอัตโนมัติ ซึ่งเราไม่ต้องเขียน โค้ดส่วนนี้เลย ง่ายไหมครับสำหรับการใช้งาน CGridView ลองนึกภาพว่าถ้า เราต้องทำระบบเองให้ได้แบบนี้ คงเป็นเรื่องที่เหนื่อยมากไม่ใช่น้อยเลย

ดึงข้อมูลมาแสดงบน CListView สำหรับ components ที่ชื่อว่า CListView นั้นก็มีรูปแบบการแสดงผล อีกแบบหนึ่งที่เรียงข้อมูลลงมาเรื่อย ๆ เช่นกันกับ CGridView แต่ว่าจะต่างกัน ตรงที่ไม่ได้แสดงผลในรูปแบบของตาราง เช่นการแสดงรายการ บลอก ข้อมูล สินค้า ตัวอย่างข้อมูลที่แสดงผลแบบ CListView

65


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

เพื่อให้เข้าใจยิ่งขึ้นเราลงมือกันเลยดีกว่าครับ เริ่มต้นก็เขียน function เพิ่ม เข้าไปอีกใน controller ของเราดังนี้ /app/protected/controllers/Chapter5Controller.php

จากนั้นทำการสร้าง view

66


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter5/CListView.php

การกำหนด itemView คือการบอกให้รู้ว่ารูปแบบหน้าตาจะให้ใช้ไฟล์ ไหน ซึ่งที่นี้คือไฟล์ชื่อ _CListView.php ในนี้ไม่ต้องระบุนามสกุลนะ ครับ ตำแหน่งของ widget ตัวนี้ชื่อว่า zii.widgets.CListView

/app/protected/views/Chapter5/_CListView.php

67


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

การดึงข้อมูลมาวาง ในแต่ละรอบ ใช้ตัวแปร $data->ชื่อฟิลด์ของ ตาราง

ผลการทำงาน

นอกจากจะแสดงข้อมูลได้แล้ว ยังแบ่งให้เราโดยอัตโนมัติด้วย (ปกติแล้วคือ หน้าละ 10 รายการ)

68


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

แบบนี้ก็ง่ายดายเลยใช่ไหมครับ เราอยากได้รูปแบบหน้าตายังไงก็กำหนดเอา ในไฟล์ _CListView ได้เลย อ้อ จริง ๆ แล้วจะตั้งชื่ออะไรก็ได้ครับไม่จำเป็น ต้องใส่ _ นำหน้า เพียงแต่ว่าผมทำเพื่อให้ดูแล้วเข้าใจง่ายเท่านั้นเอง

CActiveForm กับการ INSERT DATA ในตัวอย่างนี้เราจะได้ทำการสร้าง Form เพื่อบันทึกข้อมูลลงไปดูบ้าง เพราะที่ผ่านมาเราทำการกรอกผ่านทางฐานข้อมูลโดยตรง ซึ่งก็ลำบากมาก ในการใช้งานจริง เอาล่ะครับ เริ่มต้นเลยก็ทำการสร้าง function เพิ่มอีกดังนี้ /app/protected/controllers/Chapter5Controller.php

บรรทัดที่ 26 ตรวจสอบว่ามีการส่งข้อมูลมาหรือยัง ถ้ามีก็จะเริ่ม ทำการบันทึกข้อมูลลงไป โดยกำหนดค่าให้กับ _attributes แบบง่าย ๆ

69


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ก็คือกำหนดให้ตรงกับที่ส่งเข้ามา จากนั้นทำการ save() และก็ redirect เพื่อย้ายการทำงานไปยัง Form render คราวนี้มีการฝากตัวแปรไปด้วยนั่นคือ book เพื่อนำไปใช้กับ Form ให้มีข้อความต่าง ๆ เพื่อกรอกได้สะดวก

สร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter5/Form.php

• •

จุดสังเกต เริ่มต้นก็คือสร้าง form object โดยเลือกจาก widget การใช้ labelEx ก็คือไปอ่านค่าที่ตั้งไว้ใน model ว่าจะให้เป็นคำว่าอะไร 70


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

การใช้ textField คือการสร้างช่องให้กรอก และผูกเข้ากับฟิลด์ของ ฐานข้อมูล ไปด้วยทันที

ผลการทำงาน

เมื่อกรอกข้อมูลแล้วตรวจสอบดู

71


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

CActiveForm กับการ UPDATE DATA ตัวอย่างนี้จะทำการกดแก้ไข และดึงข้อมูลมาแสดง พร้อมกับให้ สามารถแก้ไขรายการได้ตามต้องการ ก่อนอื่นก็ทำการแก้ไข function form() ใน controller ให้เป็นดังนี้ /app/protected/controllers/Chapter5Controller.php

72


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

บรรทัด 27 29 30 39 40

คำอธิบาย รับค่าจาก Form มาเก็บไว้ในตัวแปรชื่อว่า $id ทำการตรวจสอบค่า หากตัวแปร $id ไม่ใช่ค่าว่าง สร้าง object book โดยไปค้นจากรหัส ใช้คำสั่ง indByPk ทำการตรวจสอบค่าตัวแปร $id ถ้าไม่ใช่ค่าว่าง สร้าง object book โดยไปค้นจากรหัส เพื่อนำค่าไปแสดงบน ฟอร์ม

จากนั้นทำการแก้ไขโค้ดในส่วนของ view

แก้ไขให้เป็นดังนี้ /app/protected/views/Chapter5/Form.php

73


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

จากนั้นก็แก้ไขโค้ดในส่วนของ CGridView

ให้เป็นดังนี้ /app/protected/views/Chapter5/CGridView.php

ทดสอบการทำงานก่อนกดแก้ไข

74


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

เมื่อกดแก้ไข

เมื่อแก้ไขแล้ว ข้อมูลในฐานจะเปลี่ยนไปตามข้อมูลใหม่ที่ป้อนครับ ตรงนี้จะ เห็นว่าเราไม่ต้องทำการกำหนดค่าเริ่มต้นให้กับ textield ต่าง ๆ เลยเพราะว่า yii framework ได้จัดการให้แล้ว แถมยังสบายในส่วนการสร้างปุ่มลงบน CGridView ด้วยครับ

75


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

CGridView กับการ DELETE DATA ในบทนี้จะได้ทำการกดปุ่มลบรายการ โดยกดจากหน้าจอของ CGridView และส่งค่ามาครับ ก่อนอื่นก็ให้ทำการแก้ไขโค้ดของ CGridView โดยการเติมโค้ดลงไปอีกดังนี้ /app/protected/views/Chapter5/CGridView.php

บรรทัด 12 – 18 13 14 15 16 17 18

คำอธิบาย สร้างปุ่มลบรายการ กำหนดเป็นชนิด html ใช่ Html::link ลงไป เพื่อให้กดและส่งค่าไปได้ กำหนดค่าด้าน html option กำหนด event onclick เพื่อให้ยืนยันการลบ (กรณีเผลอกด) สิ้นสุดการกำหนด html option สิ้นสุดการสร้างปุ่ม

76


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

ทดสอบการทำงาน

เขียนโค้ดเพิ่มอีกใน controller /app/protected/controllers/Chapter5Controller.php

ทำการลบรายการ

77


Yii Framework : บทที่ 5 Database Programming www.javathailand.com

กดยืนยันข้อมูลจะหายไป ในตัวอย่างนี้ผมได้ลบ id 9 ออก

ปิดท้ายบท ในบทนี้ก็ได้นำเสนอเกี่ยวกับวิธีการเขียนโค้ดและใช้งาน Database Component ไปพอสมควร ทั้งส่วนของ CActiveForm ด้วย และการรับส่งค่า จาก model – controller – view ไปมา ซึ่งก็ทำให้เข้าใจการทำงานกับฐาน ข้อมูลด้วย Yii Framework ได้มากยิ่งขึ้นครับ แม้จะเป็นเพียงพื้นฐานเล็ก ๆ น้อย ๆ แต่ก็เพียงพอที่จะต่อยอดระดับลึก ซึ่งอยู่ในบทถัดไป ตลอดเวลาที่ผมเขียนระบบด้วย Yii นั้นผมชื่นชอบ CGridView, CListView มาก เพราะช่วยให้ผมลดโค้ดส่วนของ pageination, sort ไปได้มาก ทีเดียว อีกทั้งจัดรูปแบบ CSS ข้างในได้ดั่งใจอีกทำให้ระบบมีหน้าตาที่แตก ต่างกันออกไปได้ โดยไม่ต้องเครียดเลย

78


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ก่อนเข้าเนื้อหา ในบทที่ผ่านมาผู้อ่านก็ได้เรียนรู้การจัดการกับระบบฐานข้อมูลเบื้อง ต้นไปบ้างแล้ว ไม่ว่าจะเป็นการ INSERT, UPDATE, DELETE, SELECT รวมไป ถึงการนำขึ้นมาแสดงบน Database Component ต่าง ๆ เช่น CGridView, CListView, CActiveForm เป็นต้น มาในบทนี้เราจะได้เจาะลึกยิ่งขึ้นไปอีก เกี่ยวกับการปรับแต่งแต่ละ Component เพื่อให้ตอบโจทย์การทำงานจริง ๆ ของเรา แน่นอนครับ ไม่มีงานไหนในโลกที่จะทำได้แค่ บันทึก แสดง แก้ไข ลบ แล้วก็จบกันไป มันก็ต้องมีการกำหนดรูปแบบ เงื่อนไข และอะไรอีกมากมาย สารพัดเต็มไปหมด และในบทนี้เองผมจะได้พาจัดการกับสิ่งที่จะต้องพบอย่าง แน่นอนในวันหน้า ไม่ว่าจะทำระบบอะไรก็ตาม ซึ่งบอกได้เลยว่า หาตัวอย่าง ตามตำราเล่มอื่น ๆ ยากมาก เกี่ยวกับการใช้งาน Component เพื่อให้ตอบ โจทย์ได้แบบนี้ ผมได้รวบรวม และสรุปมาจากประสบการณ์ตรง ๆ ที่เขียน Yii มาพัก ใหญ่ และได้สรุปแบบสั้น ๆ ลงในบทนี้แล้ว

รู้จักกับ CPageSize จากที่ผ่านมาเราได้ทำการแสดงผลรายการกันแล้ว แถมยังแบ่งหน้า แสดงผลได้อีกต่างหาก นับว่าสุดยอดไปเลยครับ แต่ทว่า บางครั้งเราก็ ต้องการให้แบ่งหน้า 5 รายการบ้าง 20 รายการบ้าง อันนี้มันก็เอาแน่ไม่ได้ ว่า แต่ละหน้านั้นจะแสดงผลกี่รายการกันแน่ ดังนั้นใน Yii Framework จึงได้มี CPageSize ให้จัดการ เพื่อแบ่งหน้าได้

79


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ทำการสร้าง Controller ขึ้นมาใหม่

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter6Controller.php

80


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter6/CPageSize.php

ผลการทำงาน

81


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

จากตัวอย่างนี้ผมได้ทำการแบ่งหน้าเพียงหน้าละ 3 รายการ ก็เพื่อให้ เห็นว่าเราสามารถกำหนดหน้าละกี่รายการก็ได้ ง่าย ๆ เลยใช่ไหมครับ นี่แห ละเสน่ของ Yii Framework แถมยังใช้งานง่ายดายอีกด้วยครับ

ใช้งาน CSort เป็นส่วนของการเรียงข้อมูล สามารถเรียงได้ทั้งแบบ มากไปน้อย และ แบบน้อยไปมาก วิธีการใช้งานก็ง่ายครับ เริ่มแรกเราสร้าง function เพิ่มลงใน controller อีกดังนี้ /app/protected/controllers/Chapter6Controller.php

82


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

บรรทัด คำอธิบาย 26 สร้าง criteria object เพื่อใช้กรอง และเรียงข้อมูลได้ 27 กำหนดให้ทำการ ORDER (เรียง) โดยเลือกเรียงจากราคา มาก ไปน้อย (DESC) 30 กำหนดค่า criteria ให้กับ CActiveDataProvider เพื่อให้ข้อมูล ทำการเรียง ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter6/CSort.php

83


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ทดสอบการทำงาน

กรองข้อมูลด้วย CCriteria ในบางครั้งหากเราต้องการค้นหารายการแบบ WHERE เราก็จำเป็น ต้องใช้สิ่งที่เรียกว่า CCriteria ครับ ซึ่งกำหนดเงื่อนไขได้สารพัดเลย และที่สุด ยอดมากก็คือสามารถ WHERE ในกรณีที่สุดแสนซับซ้อนได้ เช่นการไป WHERE เงื่อนไขของตารางที่ JOIN กันเป็นต้น และกรณีอื่น ๆ อีกสารพัด เริ่ม ต้นกันเลย ผมจะพาสร้าง function เพิ่มอีกโดยเพิ่มลงใน Controller ตัวเดิม ของเรา เขียนโค้ดลงไปดังนี้

84


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

/app/protected/controllers/Chapter6Controller.php

ทำการสร้าง view

85


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

เขียนโค้ดดังนี้ /app/protected/views/Chapter6/CCriteria.php

ทดสอบการทำงาน

86


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

การค้นด้วย LIKE ตัวอย่างนี้ผมจะพาทำการค้นหาข้อมูลด้วยคำสั่ง LIKE ที่หลายคนคุ้น เคยเป็นอย่างดีครับ เริ่มแรกก็เขียนโค้ดเพิ่มอีกใน controller เราดังนี้ /app/protected/controllers/Chapter6Controller.php

ทำการสร้าง view

87


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter6/Like.php

ผลการทำงาน

88


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

การค้นหาด้วย Function พิเศษ บางครั้งเราก็ต้องทำการใช้ Function ทางด้าน Database ครับเช่น SUM, MAX, MIN เป็นต้น แล้วจะทำอย่างไรล่ะใน Yii Framework ลองมาดู กันเลย เริ่มแรกก็สร้าง function เพิ่มเข้ามาอีกใน controller ดังนี้ /app/protected/controllers/Chapter6Controller.php

ทำการสร้าง view

89


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter6/MyFunc.php

เขียนโค้ดเพิ่มเข้ามาอีกใน model /app/protected/models/Book.php

ทดสอบการทำงาน

90


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

การแทรกภาพลง CGridView คราวนี้เราจะมาใส่ภาพแทนปุ่มกดอันแสนธรรมดา ให้กลายเป็นปุ่ม สวย ๆ งาม ๆ กันครับ เริ่มต้นเลยก็ไปหาภาพสวย ๆ มาก่อนสองภาพ วางลง ไปใน images

วางภาพลงไป

จากนั้นแก้ไขโค้ดส่วนของ view

91


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ปรับโค้ดดังนี้ /app/protected/views/Chapter6/CPageSize.php

ผลการทำงาน

92


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

เพื่อให้กดใช้งานได้ เราต้องทำให้กลายเป็นแบบ LinkButton แก้ไขโค้ดอีกนิด หน่อยดังนี้ /app/protected/views/Chapter6/CPageSize.php

• • •

การกำหนดให้ class = CLinkColumn จะทำให้กลายเป็นปุ่มที่กดได้ ค่า imageUrl = การกำหนดภาพที่ใช้แสดง ค่า urlExpression = การกำหนด url ปลายทางที่จะส่งค่าไป

93


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ผลการทำงาน

เมื่อกดที่ปุ่มแก้ไข

เมื่อกดปุ่มลบ

94


Yii Framework : บทที่ 6 Advanced Database Programming www.javathailand.com

ปิดท้ายบท สำหรับเนื้อหาบทนี้ผู้อ่านได้เรียนรู้ถึงการใช้งานชุด Components ต่าง ๆ อย่างลึกซึ้งแล้ว รวมทั้งเทคนิคต่าง ๆ อีกหลายอย่างเพื่อใช้จัดการกับฐาน ข้อมูล ฟังดูอาจจะเป็นเพียงเรื่องเล็กน้อย แต่ก็หาอ่านได้ยากมากตามตำรา ทั่วไป โดยเฉพาะอย่างยิ่งการเข้าจัดการกับ CGridView เดี๋ยวพอเข้าบทต่อไป จะเป็นเรื่องของเทคนิคพิเศษ เพื่อเสริมให้อีก รวมถึงเรื่องของการเชื่อมความ สัมพันธ์ระหว่างตารางต่าง ๆ ทั้งแบบ 1 to many และแบบ many to 1 yii framework มีจุดเด่นในเรื่องของความเร็ว ทั้งตัวงานที่ได้ออกมา และระยะเวลาที่ต้องเสียไป ทำให้ได้รับความนิยมอย่างสูงสุดจนกลายเป็น อันดับ 1 ของโลกได้หลายปีต่อเนื่อง ตราบจนปัจจุบันนี้ แต่ด้วยเนื้อหาที่เยอะ มาก จะว่าเป็นโลกอีกใบเลยก็ได้ เพราะมีคำสั่งมีคลาส และฟังก์ชั่นต่าง ๆ มหาศาล ดังนั้นจึงต้องใช้เวลาในการทำความเข้าใจนานสักหน่อย แต่อย่างไร ก็ตามผมได้สรุปเอาใจความสำคัญออกมาเป็นหนังสือเล่มนี้แล้วเรียบร้อย แล้วพบกันอีก ในบทถัดไปครับ

95


บทที่ 7 Tip and ORM www.javathailand.com

ก่อนเข้าเนื้อหา บทนี้ก็เป็นอีกบทหนึ่งที่จะได้เผยแพร่ถึงเทคนิคเสริมต่าง ๆ ที่บทอื่น ๆ ไม่ได้เขียนไว้ ซึ่งมีความสำคัญอย่างมากครับ เพราะว่าเป็นเทคนิคที่ได้ใช้ อย่างแน่นอน ไม่ว่าจะทำระบบใด ๆ ก็ตาม และก็หาได้ยากยิ่งตามตำราทั่วไป แม้แต่หนังสือในต่างประเทศเองก็ด้วย เทคนิคเหล่านี้ผมได้เขียนขึ้นจากประสบการณ์ตรง ดังนั้นจึงมั่นใจได้ ว่า ไม่ได้ทำการแปลมาจากตำรา แล้วแก้ข้อความเป็นของตัวเองอย่างแน่นอน ซึ่งนอกจากจะเข้าใจได้ง่ายแล้ว ก็ยังทำให้นำไปประยุกต์ต่อได้อย่างง่ายอีก ด้วยครับ เอาล่ะ นอกจากจะนำเสนอถึงเทคนิคพิเศษแล้ว ก็ยังได้พาเขียนส่วน ของการเชื่อมตารางแบบต่าง ๆ ด้วย เพื่อให้สามารถใช้งาน ORM ได้อย่าง เต็มประสิทธิภาพที่สุด ตรงนี้เอง yii framework ได้เตรียมไว้ให้เราใช้งานแล้ว และยังยืดหยุ่นมาก หากเทียบกับ framework เจ้าอื่น ๆ แล้วเรื่อง ORM ของ yii framework ถือได้ว่าเป็นสุดยอดในเรื่องความยืดหยุ่น ทำให้เราไม่ต้อง เขียนโค้ดภาษา SQL เลยตลอดโปรเจคก็ยังได้ ก่อนจะลงไปยังเนื้อหาของบทนี้ ผมก็ต้องขออภัยผู้อ่านก่อนเนื่องด้วย ผมได้ทำการเปลี่ยนเครื่อง ระหว่างที่เขียนหนังสือเล่มนี้ และจากบทนี้ไปก็จะ เป็นหน้าจอการแสดงผลบน Mac แต่อย่างไรก็ตาม ส่วนอื่น ๆ ยังคงเหมือน เดิมทุกอย่าง ยกเว้นแค่หน้าตา กับ Font เท่านั้น ส่วนเรื่อง path ก็ไม่ได้ เปลี่ยนไปครับ ก่อนอื่นเลยขอให้ทำการสร้าง controller ขึ้นมาเพื่อใช้เป็นตัวอย่างใน บทนี้ โดยสร้างตามภาพ

96


บทที่ 7 Tip and ORM www.javathailand.com

การทำ lter ให้กับ CGridView ที่ผ่านมานั้น CGridView ของเราทำได้เพียงการแสดงรายการออกมา แต่หากว่าต้องการค้นหารายการนั้นล่ะ เราก็คงต้องเขียนโค้ดเพื่อ WHERE อย่างวุ่นวายสารพัดไปหมด แน่นอนว่าเราไม่ได้มีเวลาขนาดนั้น ดังนั้นผมเลย นำเสนอถึงเทคนิคต่อไปนี้ ซึ่งช่วยให้ตอบโจทย์ได้โดยไม่ต้องเขียนโค้ดอะไรให้ วุ่นวายเลย เริ่มต้นก็เขียนโค้ดลงไปดังนี้ /app/protected/controllers/Chapter7Controller.php

• unsetAttributes() ใช้เพื่อเคลียร์ค่าต่าง ๆ ออกก่อน • ในบรรทัดที่ 10 attributes = $_GET['Book'] ใช้กำหนดค่าลง attributes จากนั้นทำการสร้าง view

97


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/Filter.php

• 'flter' => $model ใช้กำหนดให้มีช่อง textbox วางไว้ด้านบนเพื่อ ค้นหาได้ โดยอิงฟิลด์ตาม $model จากนั้นก็เขียนโค้ดเพิ่มเข้าไปอีกใน model

เพิ่มส่วนของการทำ validation ลงไปก่อน เพื่อใช้ตรวจสอบข้อมูล /app/protected/models/Book.php

98


บทที่ 7 Tip and ORM www.javathailand.com

• • • •

บรรทัดที่ 25 เป็นการบอกว่า name, price ต้องกรอก บรรทัดที่ 26 เป็นการกำหนดว่าช่อง price ต้องเป็นตัวเลขเท่านั้น บรรทัดที่ 27 เป็นการกำหนดว่า name ต้องกรอกไม่เกิน 255 ตัว บรรทัดที่ 28 เป็นการบอกว่า id, name, price จะใช้ในการค้นได้

จากนั้นเพิ่มส่วนของการค้นหารายการ /app/protected/models/Book.php

• บรรทัดที่ 35 เป็นการเปรียบเทียบ id • บรรทัดที่ 36 เป็นการเปรียบเทียบ name โดยเป็นแบบ %xx% • บรรทัดที่ 37 เป็นการเปรียบเทียบ price

99


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานก่อนค้นหา

ลองป้อนคำค้น

ผลการทำงานเมื่อกด enter

100


บทที่ 7 Tip and ORM www.javathailand.com

ง่ายดายเลยใช่ไหมครับ ไม่ต้องมาเขียนโค้ดอะไรให้ปวดหัววุ่นวาย ก็ สามารถค้นได้ และหากสังเกตดี ๆ จะพบว่าเป็นแบบ AJAX ด้วยนะ เว็บเรา ไม่มีการ Refresh เลย เจ๋งไหมครับ เท่านี้ก็สบายไปได้เยอะ

101


บทที่ 7 Tip and ORM www.javathailand.com

การทำกล่องค้นหาภายนอก CGridView ในบางครั้งเราก็ต้องการทำช่องค้นหาไว้นอก CGridView เพื่อให้ สะดวกในการใช้งาน เพราะการวางลง CGridView นอกจากกินพื้นที่แล้ว ก็ยัง ทำให้แลดูใช้งานยากอีกด้วย อาจจะเหมาะสมบ้างแค่ในบางกรณีเท่านั้น ดัง นั้นครับหลาย ๆ คนก็เลยสร้าง Form เพื่อค้นรายการขึ้นมาเอง หารู้ไม่ว่าทาง yii framework เขาได้มีวิธีการให้เราแล้ว แถมยังง่ายดายอีกด้วย เรามาเริ่มกันเลยครับ ให้ทำการเขียนโค้ดเพิ่มอีกในไฟล์ view ของเรา ตามนี้

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/Filter.php

• RenderPartial เป็นการไปดึงเอาไฟล์ _search.php มาแสดงผลตรงนี้ 102


บทที่ 7 Tip and ORM www.javathailand.com

คล้ายกับการ include นั่นเองครับ จากนั้นก็สร้าง view มาอีก

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/Filter.php

103


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานก่อนค้นหารายการ

ป้อนคำค้นหา

104


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงาน

สังเกตช่อง url ด้านบนจะเป็นดังนี้ สุดยอดอีกแล้วใช่ไหมล่ะครับ นอกจากจะสามารถค้นหาได้แล้ว ก็ยัง จำค่าเดิมไว้ด้วยว่าเราค้นคำว่าอะไรลงไป แถมยังไม่พอ ตรงช่อง textbox ใน CGridView ก็ยังมีคำว่า php ลงไปให้ด้วย เพื่อให้รู้ว่าเราค้นจาก column ไหน

105


บทที่ 7 Tip and ORM www.javathailand.com

การใส่เงื่อนไขปุ่มกดให้กับ CGridView ในการแสดงรายการออกมา บางทีเราก็ต้องมีปุ่มแก้ไข ลบ แต่จะทำ อย่างไรกันดีหากว่าบางรายการเท่านั้นที่จะให้เราลบได้ ถ้าเป็นการเขียน PHP ทั่วไปเราก็แค่ loop แล้ว if ในแต่ละแถวเอา แต่งานนี้ไม่ใช่ซะแล้วเพราะว่าเรา ใช้ CGridView คับ ดังนั้นต้องมีวิธีการจัดการกับโจทย์นี้ เอาล่ะ ผมครุ่นคิดอยู่นานสำหรับกรณีนี้ในตอนเริ่มต้นหัดเขียน yii ใหม่ ๆ และในที่สุดผมก็ค้นพบคำตอบ จึงได้นำมาเขียนลงเป็น tip หัวข้อนี้ ครับ เรามาเริ่มกันเลยดีกว่า เงื่อนไขของเรามีอยู่ว่าให้แก้ไขได้เฉพาะรายการ ที่เจ้าของรายการคือรหัส 2 เท่านั้น อันดับแรกขอให้ทำการเพิ่มฟิลด์ลงไปอีกในตาราง books ดังนี้ครับ โดยตั้งชื่อว่า author_id ชนิด int ขนาด 11

จากนั้นก็แก้ไขข้อมูลให้เป็นไปตามนี้

เมื่อเตรียมข้อมูลแล้วก็เข้าสู่ขั้นตอนการเขียนโค้ด ให้เขียนเพิ่มลงใน controller ดังนี้ครับ

106


บทที่ 7 Tip and ORM www.javathailand.com

เขียนเพิ่มดังนี้ /app/protected/controllers/Chapter7Controller.php

จากนั้นทำการสร้าง view

107


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/ButtonAndGridView.php

• บรรทัดที่ 8 – 16 เป็นการสร้างปุ่มลงไป โดยมีเงื่อนไขดังนี้ ◦ มีข้อความด้านบนว่า edit ◦ ชนิดเป็นแบบ html ◦ ข้อความที่แสดง ให้ไปเอาค่ามาจาก $model ของ function getButtonEdit() ◦ รูปแบบการแสดงผล htmlOptions เป็นดังนี้ ▪ ให้ align = center ▪ width = 35px ทำการเขียนโค้ดเพิ่มใน model

108


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดเพิ่มดังนี้ /app/protected/models/Book.php

• getButtonEdit($data, $row) ก็คือ ◦ $data = ค่าที่ทำให้เราอ้างอิง $model object ได้ ◦ $row = แถวของรายการ แต่ละแถว • $url = สร้าง url ปลายทางไปยัง Chapter5/Form และส่ง id ไปด้วย • $link = Link Button ที่สร้างเพื่อให้กดได้ ผลการทำงาน

109


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานเมื่อเรากดปุ่ม edit

ง่ายดายเลยใช่ไหมครับ เราสามารถทำการควบคุมการแสดงผลแต่ละ แถวของ CGridView ได้อย่างง่ายดายมากเลย เพียงมาจัดการที่ model เท่านั้นเอง จากตัวอย่างก็จะเห็นว่ารายการไหนที่ author_id = 2 รายการนั้น ก็จะมีปุ่ม edit ให้เห็นครับ

110


บทที่ 7 Tip and ORM www.javathailand.com

การทำ CheckBox ลง CGridView นี่ก็เป็นอีกตัวอย่างที่พลาดไม่ได้เลย ในหลาย ๆ งานที่เราเขียนระบบ ขึ้นมาแน่นอนว่าบ่อยครั้งต้องให้เลือกรายการได้แบบ multi row โดยผ่านทาง CheckBox Component แต่จะเขียนอย่างไรล่ะให้ใช้โค้ดน้อยที่สุดเท่าที่จะทำได้ ในอดีตเป็นเรื่องยากครับ เพราะต้องเขียน <input type=”checkbox” name=”myname[]” /> แล้วก็ส่งค่าไปแบบ Array แถมยังไม่พอ ต้องทำการรับค่ามาใช้อย่างยุ่งยากอีก ยิ่งโดยเฉพาะ หากว่าทำการเลือกแล้วให้มีสีทาตรงแถวนั้นไว้ด้วย หรือทำแบบ Checked All ยิ่งยากเข้าไปอีก แต่ไม่ต้องห่วง วันนี้ yii framework ให้คุณเขียนได้ด้วยโค้ด เพียง 1 บรรทัดเท่านั้น มาลองกันเลยดีกว่า เร่ิมแรกก็ทำการเขียน function เพิ่มเข้าไปใน controller ดังนี้ครับ

เขียนโค้ดเพิ่มลงไปอีกดังนี้ /app/protected/controllers/Chapter7Controller.php

111


บทที่ 7 Tip and ORM www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/CheckboxAndGridView.php

• SelectableRows = 2 คือให้เลือกได้หลาย ๆ รายการพร้อมกัน และมี ส่วนของการ Check All ได้ด้วย • array('class' => 'CCheckBoxColumn') คือการกำหนดให้แสดง CheckBox Component ลงไป พร้อมกำหนดชื่อได้ด้วย

112


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานก่อนส่งข้อมูล

ผลการทำงานเมื่อเลือกรายการ

113


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานเมื่อกดส่งข้อมูล

ผลการทำงานเมื่อกดแบบ Checked All

ง่าย ๆ ใช่ไหมครับ เพียงเท่านี้ก็ได้ระบบที่สามารถแสดงแบบสลับสี มี การแบ่งหน้า จัดเรียงได้ และยังเลือกรายการได้อีก ช่างสุดยอดไปเลย ผล งานราวมืออาชีพมาเขียนเอง

114


บทที่ 7 Tip and ORM www.javathailand.com

การทำ RadioButton ลง CGridView นี่ก็อีกตัวอย่างที่พลาดไม่ได้เลย นั่นคือการให้เลือกได้เพียงรายการ เดียวเท่านั้น สำหรับ yii framework ได้เตรียมส่วนนี้ไว้ให้เราแล้วเรียบร้อย ครับ ลองมาดูกันว่าใช้อย่างไร เริ่มแรกก็เขียนโค้ดเพิ่มลงไปใน controller

เขียนโค้ดเพิ่มไปดังนี้ /app/protected/controllers/Chapter7Controller.php

ทำการสร้าง view

115


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/RadioAndGridView.php

• SelectableRows = 1 คือให้เลือกได้เพียงรายการเดียวเท่านั้น ผลการทำงานก่อนส่งข้อมูล

116


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงานเมื่อคลิกรายการ

ผลการทำงานเมื่อส่งข้อมูลไปแล้ว

เพียงเท่านี้เราก็สามารถส่งข้อมูลไปได้แล้วครับ โดยให้เลือกเพียง รายการเดียวเท่านั้น เห็นไหมครับว่า CGridView นั้นเจ๋งขนาดไหน ที่จริงแล้ว ยังมีเทคนิคเด็ด ๆ อีกเพียบเกี่ยวกับ CGridView เดี๋ยวผมนำมาเสนอทีละเรื่อง ช้า ๆ ครับ 117


บทที่ 7 Tip and ORM www.javathailand.com

data validation ในตัวอย่างนี้ผมจะพาทำการตรวจสอบข้อมูลโดยผ่านทาง validation method ครับ ซึ่ง model มีให้เราใช้งานได้เลย และ ถ้ามองกลับไปดูโค้ดจะพบ ว่าเราได้เขียนไปแล้ว เพียงแต่ว่ายังไม่ได้นำไปใช้งานกัน มาดูโค้ดที่เราได้เขียนไปแล้วครับ ขอให้เปิดส่วนของ model ดังภาพนี้

ลองดูโค้ดข้างใน /app/protected/models/Book.php

หวังว่าคงจำกันได้ เราได้เขียนไปแล้วในตัวอย่างที่ผ่านมา คราวนี้ลอง มาดูกันซิว่า มันทำงานอย่างไร แล้วไปทำตอนไหนกัน เริ่มจากทดสอบ โปรแกรมโดยพิมพ์ดังนี้ ผลการทำงาน

118


บทที่ 7 Tip and ORM www.javathailand.com

หากเราไม่ทำการกรอกข้อมูลใด ๆ ระบบก็จะไม่ยอมบันทึกรายการให้ เลย นั่นแปลว่าส่วนของการ validate ได้ทำงานแล้วครับ ขั้นตอนต่อไปก็เพียง แค่ทำการเขียนโค้ดเพื่อให้แสดง alert message ขึ้นมาแจ้ง เริ่มแรกเราก็ไป เขียนโค้ดเพิ่มอีกใน view

เพิ่มเข้าไปอีกดังนี้ /app/protected/views/Chapter5/Form.php

เมื่อเราทำการกรอกข้อมูลผิดรูปแบบ หรือไม่ได้กรอก ก็จะขึ้นข้อความดังนี้

119


บทที่ 7 Tip and ORM www.javathailand.com

ง่าย ๆ สบาย ๆ ใช่ไหมครับ ไม่ต้องมาเขียนโค้ดเพื่อ if อะไรให้ปวดหัว วุ่นวายเลย และยังตรวจสอบได้ทั้ง email, phone, number, website ด้วย ครับ เพียงแต่รายละเอียดต่าง ๆ จะอยู่ใน document ของ yii สามารถทำการ ศึกษาต่อยอดได้นะครับ ตัวอย่างนี้ของผมก็นำเสนอเพียงการใช้ในเบื้องต้นไว้ ก่อนครับ

120


บทที่ 7 Tip and ORM www.javathailand.com

เชื่อมความสัมพันธ์กับตารางอื่น ๆ ในที่สุดเราก็มาถึงเรื่องที่สำคัญมาก นั่นก็คือการเชื่อมความสัมพันธ์ ระหว่างตารางต่าง ๆ เข้าด้วยกัน เรียกว่าเป็นการผูก Table ครับ ซึ่งก็มีกัน ทั้งหมด 4 แบบคือ 1:1, 1:M, M:1, M:M แต่ที่เราพบเจอส่วนมากแล้วจะเป็น แบบ 1:M และแบบ M:1 เสียมากกว่า ผมเลยยกตัวอย่างแค่เพียงสองแบบนี้ เท่านั้น การเชื่อมแบบ BELONGS_TO เป็นการเชื่อมความสัมพันธ์แบบ M:1 ครับ เช่นตาราง books กับ book_types มีโครงสร้างดังนี้

และอีกตารางครับ

จากภาพนี้ก็จะเห็นได้เลยว่า ตาราง books มี FK ชื่อว่า book_type_id เชื่อมเข้ามาหาตาราง book_types ในแบบของ BELONGS_TO หรือเรียกกันว่า กลุ่มต่อหนึ่งนั่นเอง ก่อนจะไปทำการเขียนโค้ดกันต่อ ขอให้เพิ่มข้อมูลไปในตาราง book_types กันก่อนดังนี้

121


บทที่ 7 Tip and ORM www.javathailand.com

จากนั้น update ข้อมูลตาราง books

เพื่อให้เข้าใจการนำมาใช้งานผมจะพาเขียนโค้ดกันเลย เริ่มจากทำการ สร้าง model ของ book_types table ก่อนครับ

122


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/models/BookType.php

เพิ่มโค้ดใน model book

แก้ไขส่วนของการทำ attributeLabels /app/protected/models/Book.php

123


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดเพื่อสร้าง function relations() /app/protected/models/Book.php

เขียนโค้ดเพิ่มใน controllers

เขียนโค้ดไปอีกดังนี้ /app/protedted/controllers/Chapter7Controller.php

ทำการสร้าง view

124


บทที่ 7 Tip and ORM www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protedted/views/Chapter7/BelongsTo.php

ทดสอบการทำงาน

125


บทที่ 7 Tip and ORM www.javathailand.com

การเชื่อมแบบ HAS_MANY การเชื่อมความสัมพันธ์ในแบบ HAS_MANY จริง ๆ แล้วก็คือ M:1 นี่เองครับ จากตารางตัวอย่างที่เราเห็นจะพบได้เลยว่าฝั่งที่เป็น 1 ก็คือ book_types ส่วนฝั่งที่เป็นแบบ Many คือ books เพราะว่าในประเภทหนังสือ 1 ประเภทนั้นมีหนังสือได้หลายเล่ม เริ่มต้นก็เขียนโค้ดเพิ่มลงใน controller

เขียนโค้ดเพิ่มไปอีกดังนี้ /app/protected/controllers/Chapter7Controller.php

ทำการเขียนโค้ดเพิ่มใน model

เขียนเพิ่มอีกดังนี้ /app/protected/models/BookType.php

126


บทที่ 7 Tip and ORM www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/Chapter7/HasMany.php

127


บทที่ 7 Tip and ORM www.javathailand.com

ผลการทำงาน

128


บทที่ 7 Tip and ORM www.javathailand.com

ปิดท้ายบท จากตัวอย่างที่ผ่านมาทั้งหมด ผู้อ่านก็ได้เรียนรู้เกี่ยวกับการจัดการ CGridView และการเชื่อมความสัมพันธ์ระหว่างตารางด้วย ORM กันไปแล้ว เรียบร้อยครับ ซึ่งก็เป็นเทคนิคต่าง ๆ ที่หายากมากทีเดียว ตลอดเนื้อหาของ บทนี้ก็นับได้ว่ามีรายละเอียดมากกว่าบทอื่น ๆ ทั้งหัวข้อ และจำนวนหน้า ก่อนจากกันในบทนี้ผมอยากให้ลองทบทวนอ่านเล่น ๆ อีกซักรอบ เพราะว่าในบทต่อไปจะเป็นการลงไปที่ workshop ซึ่งต้องใช้ความรู้ทั้งหมดที่ เราเรียนมาตลอด 7 บท ไปสร้างช้ินงานกันจริง ๆ ถึงตรงนี้ก็เชื่อว่าหลายคนคงตาโต และอึ้งในความสามารถของ Yii Framework กันแล้ว ทั้งเขียนโค้ดน้อย ทั้งยืดหยุ่น และทำอะไรได้มากมาย เหลือเกิน เรียกได้ว่าตอบโจทย์การทำงานเราแล้วครับ เพียงแต่เนื้อหาอื่น ๆ อาทิชุด Component ตัวอื่นนั้นผมก็ยังไม่ได้พูดถึง แล้วก็ส่วนของ properties, method ของแต่ละ Component ก็เช่นกัน เนื่องจากว่า yii นั้นมีอะไรอีก มากมาย ดังนั้นผมจึงได้นำเสนอแต่เพียงสิ่งที่ได้พบบ่อยที่สุด เพื่อให้ผู้อ่านใช้ เวลาน้อยที่สุดในการทำความเข้าใจ แต่นำไปใช้สร้างชิ้นงานได้ สุดท้ายนี้ ก็ขอให้ทุกท่านโชคดีครับ กับสุดยอด Framework อันดับ 1 ของโลกตัวนี้ หวังว่าจะได้พบกันอีกในโอกาสหน้า

129


บทที่ 8 workshop iService www.javathailand.com

ก่อนเข้าเนื้อหา สำหรับบทนี้นะครับก็จะพาทำ workshop เล็ก ๆ ตัวหนึ่ง โดยอิงจาก ระบบงานจริงที่ผมทำอยู่ ซึ่งเรียกชื่อสั้น ๆ ว่า iService นั่นคือระบบบริการ แจ้งซ่อมออนไลน์ นั่นเอง โดยเนื้อหาในบทนี้ผู้อ่านจะได้เรียนรู้ตั้งแต่การ Login แบบแยกสิทธิ การจัดการข้อมูลโครงสร้างองค์กรแบบ Tree ที่ไม่จำกัด ลำดับชั้น การเชื่อมโยงกับ Jquery Easy UI การเขียนโค้ดจัดการ Form ตั้งแต่ แบบธรรมดา ไปจนถึงระดับ Master Detail ครับ นอกจากนี้แล้ว ผู้อ่านก็จะยังได้เรียนรู้ถึงวิธีการเชื่อมโยงส่วนต่าง ๆ และการสร้างหน้าจอแบบ Tab UI อีกด้วย ซึ่งหาได้ยากมากในหนังสือที่เขียน เกี่ยวกับ Yii โดยทั่วไป ตลอดเนื้อหาในบทนี้ผมจะค่อย ๆ เขียนโค้ดให้ดู และอธิบายทีละส่วน ครับ อาจจะดูเหมือนละเอียดยิบมากไปหน่อย แต่หาได้ยากครับ เพราะส่วน ใหญ่แล้วจะพากันกอปโค้ดมาแปะเลย ซึ่งแบบนั้นทำให้ผู้อ่านสุดท้ายแล้วก็งง กว่าจะเข้าใจได้ก็ต้องใช้เวลามากเกินไป ดังนั้นผมจึงเลือกวิธีที่เสมือนมีคน เขียนโค้ดให้คุณดู และอธิบายให้ฟังอย่างละเอียดทุกบรรทัดที่เขียน ที่มาของระบบ iService ปฏิเสธไม่ได้เลยว่าทุกวันนี้แทบทุกหน่วยงานมีพนักงาน และมี คอมพิวเตอร์ให้พนักงานใช้ และแน่นอน นอกจากคอมพิวเตอร์แล้วก็ยังมี ปริ้นเตอร์ สแกนเนอร์ โปรเจกเตอร์ และอุปกรณ์อื่น ๆ อีกมากมายในด้าน ไอที และเมื่อมีการใช้งานอุปกรณ์เหล่านี้ไปนาน ๆ ก็ย่อมต้องมีการเสียหาย ชำรุดเกิดขึ้นอยู่เสมอ ทำให้มีการแจ้งซ่อมเข้ามายังฝ่ายที่รับผิดชอบด้านงาน ซ่อม เอาล่ะครับ ปัญหาก็เลยเริ่มเกิดขึ้นจากตรงนี้ งานเข้ามาเยอะ คนซ่อมก็ซ่อมไปเรื่อย จนจำไม่ได้แล้วว่างานของใคร ซ่อมไปถึงไหน เวลาที่เจ้าของเครื่องมาสอบถามก็ตอบไม่ได้ หรือบางทีก็ตอบ ไม่ตรงกับข้อมูลจริง เช่นค่าซ่อม วิธีการซ่อม สาเหตุอาการเสีย วันหมด ประกัน เป็นต้น ทำให้มีหลาย ๆ หน่วยงานพยามสร้างระบบแจ้งซ่อม และติดตาม สถานะแบบออนไลน์ขึ้นมา แต่ก็ยังมีน้อยนักที่สร้างระบบแล้วใช้ได้เวิคจริง ๆ เนื่องจากความซับซ้อนของระบบเอง ประกอบกับการขาดแคลน โปรแกรมเมอร์ที่จะมาเขียนระบบส่วนนี้ด้วย ทำให้ระบบ iService เป็นที่ 130


บทที่ 8 workshop iService www.javathailand.com

ต้องการของตลาดอย่างมาก ผมก็เลยได้เขียนขึ้นมาและทำการขายให้กับ หลาย ๆ หน่วยงาน ณ ปัจจุบันที่กำลังเขียนหนังสือเล่มนี้ มีหน่วยงานต่าง ๆ กว่า 100 แห่งที่ใช้ระบบ iService และมีแนวโน้มมากขึ้นเรื่อย ๆ เมื่อเป็นดังนี้ผมจึงได้นำเอาระบบดังกล่าว มาจัดทำเป็น Workshop ท้ายเล่มสำหรับหนังสือ Yii Framework เล่มนี้ นอกจากจะเป็นระบบจริงแล้ว ผู้อ่านยังได้เรียนรู้ถึงการเขียนโค้ดแบบ MVC + OOP เต็ม ๆ ด้วย ถึงแม้ว่าผมได้ตัดทอนเอาหลายส่วนออกไป ก็เพื่อให้โฟกัสลงไปที่ เนื้อหาจริง ๆ ที่เราต้องศึกษา แต่อย่างไรก็ตาม หัวใจหลักของระบบแจ้งซ่อม ออนไลน์ก็ยังคงอยู่ครบถ้วน รายละเอียดของระบบ 1. ระบบจัดการข้อมูล 1. จัดการข้อมูลองค์กร 2. จัดการข้อมูลประเภทอุปกรณ์ 3. จัดการข้อมูลอุปกรณ์ 4. จัดการข้อมูลผู้ใช้ระบบ 5. จัดการข้อมูลประเภทงานซ่อม 6. จัดการข้อมูลประเภทงานโปรเจค 2. ระบบบันทึกประจำวัน 1. ฟอร์มแจ้งซ่อมออนไลน์ 2. ประวัติการแจ้งซ่อม 3. ทะเบียนอุปกรณ์ 4. รับเรื่องที่แจ้ง 5. รับซ่อม/ตรวจสอบ 6. ปิดงานที่ซ่อมเสร็จ 3. ระบบรายงาน 1. รายงานผลการซ่อมแบบสรุป 2. รายงานข้อมูลการซ่อม 4. ระบบอื่น ๆ 1. Login เข้าระบบ 2. ลืมรหัสผ่าน 131


บทที่ 8 workshop iService www.javathailand.com

ออกแบบฐานข้อมูล database ขอให้ตั้งชื่อว่า db_iservice ครับ และสร้างตารางต่าง ๆ ดังนี้

132


บทที่ 8 workshop iService www.javathailand.com

133


บทที่ 8 workshop iService www.javathailand.com

เริ่มต้นสร้าง Project

กำหนดชื่อเป็น iservice และกด Finish ได้เลย

134


บทที่ 8 workshop iService www.javathailand.com

จากนั้นทำการติดตั้ง yii framework เข้าในโปรเจกนี้ (การติดตั้งดูในบทที่ 1) แล้วจะพบโครงสร้างไฟล์ของระบบเราดังนี้

สร้างตัวเชื่อมต่อฐานข้อมูล โดยการแก้ไข conrg

แก้โค้ดดังนี้ /app/protected/conrg/main.php

โค้ดนี้เราทำการแก้ไขส่วนของการเชื่อมต่อฐานข้อมูลครับ โดย db_name = ชื่อของฐานข้อมูล ในทีนี้ชื่อว่า db_iservice ส่วน username = root, password = root และสุดท้ายก็กำหนดการเข้ารหัสตัวอักษร charset = utf8 ครับ

135


บทที่ 8 workshop iService www.javathailand.com

เตรียม Template / CSS

* Resource, image, js, css ทั้งหมด ผมได้แนบมาให้แล้วครับ สามารถดาว โหลดโค้ดประกอบหนังสือกันได้เลยที่ www.javathailand.com/download/code_book_yii_basic.zip เขียนโค้ดลงไปดังนี้ /app/protected/views/layouts/main.php ทำการเปิดใช้หน่วยความจำชั่วคราว และเปิดใช้ session

สร้างตัวแปร $baseUrl เพื่อใช้อ้างอิง path หลัก

หากตัวแปร $content ไม่ใช่ค่าว่าง เราก็เริ่มทำการแสดงหน้าเว็บ ลำดับแรก คือกำหนด meta tag ต่าง ๆ ก่อน

136


บทที่ 8 workshop iService www.javathailand.com

กำหนดการเชื่อมโยงไฟล์ CSS และกำหนดชื่อ title ของเว็บ

กำหนดการเชื่อมโยงกับ js และปิด header

เริ่มสร้าง body และใส่ header เข้าไปให้กับเว็บ โดยให้เป็นลิงค์ที่คลิกเข้าที่ หน้าแรกของระบบคือ / หมายถึง home นั่นเอง

กำหนดรูปแบบหน้าเว็บ ถ้าหากมีการ login ก็จะเห็นเมนูด้านซ้าย แต่ถ้ายังก็ จะเห็นเพียง $content เท่านั้น

137


บทที่ 8 workshop iService www.javathailand.com

จบการทำงาน ก็แสดงส่วนของ footer และปิด tag ต่าง ๆ ของหน้าหลัก

นำไฟล์ js, css มาใส่ในโปรเจก

ตามด้วย icons, images เพื่อแสดงภาพทาง กราฟฟิค

138


บทที่ 8 workshop iService www.javathailand.com

ทำการแก้ไขโค้ดใน SiteController

/app/protected/controllers/SiteController.php สร้าง class และสืบทอดมาจาก Controller ทำการสร้าง function index และ ให้นำผลการแสดงจาก view index มาแสดง

สร้าง menu_left

ทำการเขียนโค้ดลงไปดังนี้ /app/protected/views/site/menu_left.php

139


บทที่ 8 workshop iService www.javathailand.com

สร้างเมนูแรก ปุ่มหน้าหลัก ให้วิ่งไปยัง Home/RequestForm

สร้างปุ่มที่สอง ปุ่มตั้งค่าพื้นฐาน และปุ่มรายการ จะให้เห็นเฉพาะระดับ admin เท่านั้น เราก็เขียน if ดักไว้

สร้างปุ่มข้อมูลส่วนตัว และปุ่มออกจากระบบ

140


บทที่ 8 workshop iService www.javathailand.com

จากโค้ดที่เขียนนี้ก็จะได้หน้าตาของเมนูดังภาพ

สร้าง Components

เขียนโค้ดลงไป /app/protected/components/KDate.php เริ่มต้นสร้าง class

141


บทที่ 8 workshop iService www.javathailand.com

function ในการดึงวันที่ปัจจุบัน

function ดึงวันที่ปัจจุบันและเพิ่มปีเข้าไปอีกได้

funtion แปลงรูปแบบวันที่ไปลง MySQL

function แปลงวันที่จาก MySQL มาแสดงเป็นรูปแบบไทย

142


บทที่ 8 workshop iService www.javathailand.com

function ดึงชื่อเดือนต่าง ๆ ออกมาเป็นแบบ Array

function ในการดึงปีปัจจุบัน และปีก่อนหน้า และปีถัดไป มาเป็นแบบ Array

143


บทที่ 8 workshop iService www.javathailand.com

ทำระบบ Login สำหรับหน้าจอนี้จะเป็นส่วนของการสร้างการ login เพื่อเข้าระบบครับ ก่อนอื่นลองมาดูหน้าจอต้นแบบก่อนที่จะลงมือเขียนโค้ด ซึ่งก็จะเป็นหน้าตา แบบนี้ครับ

ก่อนอื่นเพื่อให้ระบบนี้ใช้งานได้ เราต้องไปกรอกข้อมูลลงในตารางไว้ก่อนครับ โดยป้อนลงไปดังนี้

ทำการสร้าง view

144


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/views/site/index.php ออกแบบหน้าจอในการเข้าระบบ โดยให้เรียงจากบนลงล่าง แบ่งแยกด้วย <div>

จากนั้นก็ทำการสร้าง controller เพิ่มมาอีก

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/MemberController.php ทำการเปิดใช้งาน ob_start(), session_start()

เริ่มต้นสร้าง class และทำการ extends จาก Controller

เริ่มสร้าง function ในการตรวจสอบการเข้าระบบ เงื่อนไขคือค้นหาตาม employee_username, employee_password, employee_status = “active” 145


บทที่ 8 workshop iService www.javathailand.com

จากนั้นก็เก็บลงในตัวแปร $model

หากค้นหาพบก็ทำการเก็บค่าต่าง ๆ ลงใน session ไว้ และก็ทำการ redirect ไปยังหน้า home แต่หากป้อน username ไม่ถูกก็ทำการ redirect ไปยังหน้า แรก เพื่อทำการ login อีกรอบ

สร้างส่วนของ function home เพื่อแสดงผลตอนที่ทำการ login ผ่านแล้ว

สร้าง function ในการ logout และลบค่าออกจาก session

146


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้างหน้าหลักของสมาชิก เมื่อเข้าระบบแล้ว

เขียนโค้ดลงไปดังนี้ /app/protected/views/member/home.php

แสดงชื่อ username ที่เก็บไว้ใน session ให้ทำการ login เข้าระบบ แล้วจะพบกับหน้าหลักดังนี้

147


บทที่ 8 workshop iService www.javathailand.com

เพียงเท่านี้เราก็มีระบบที่สามารถ Logint, Logout ได้แล้วเรียบร้อย ขั้นตอน ต่อไปคือการทำระบบจัดการในส่วนต่าง ๆ ครับ ระบบจัดการข้อมูลพื้นฐาน ในส่วนนี้เราจะมาเขียนระบบจัดการข้อมูลพื้นฐาน ซึ่งก็มีหลายส่วน ด้วยกัน ตามหน้าจอต้นแบบดังนี้ครับ

เริ่มกันจากอันแรกเลยคือจัดการ โครงสร้างองค์กรครับ ให้เราทำการสร้าง controller ขึ้นมา

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/ConrgController.php ทำการเขียน class ชื่อ ConrgController และสืบทอดจาก Controller 148


บทที่ 8 workshop iService www.javathailand.com

สร้าง action Index เพื่อให้เป็นหน้าแรก เชื่อมโยงกับ view index

เริ่มสร้าง function GroupSetting

ทำส่วนของการบันทึก

149


บทที่ 8 workshop iService www.javathailand.com

สร้าง object 2 ตัวที่ต้องใช้งาน

เขียนโค้ดส่วนการแสดงผล และปิด function ด้วย }

จากนั้นทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/conrg/index.php

150


บทที่ 8 workshop iService www.javathailand.com

ดึงเอาไฟล์ toolbar เข้ามา ณ บรรทัดที่ 2

/app/protected/views/conrg/toolbar.php เริ่มต้นของ toolbar

กำหนดให้เฉพาะระดับ admin เมนูโครงสร้างองค์กร

เมนูประเภทงานซ่อม

เมนูประเภทงานโปรเจค

151


บทที่ 8 workshop iService www.javathailand.com

เมนูประเภทวัสดุ อุปกรณ์

เมนูผู้ใช้งานระบบ

จบขั้นตอนการสร้างไฟล์ toolbar

/app/protected/views/conrg/GroupSetting.php

152


บทที่ 8 workshop iService www.javathailand.com

เริ่มเขียนส่วนของ edit

ดึงข้อมูลจากฐานข้อมูลมาแสดง

วางข้อมูลลงไปและจบการทำงานของ java script

153


บทที่ 8 workshop iService www.javathailand.com

วาง toolbar ลงไป

เริ่มสร้าง panel_body และใส่ปุ่ม + ลงไป

สร้าง loop เพื่อแสดง group ทั้งหมดออกมา

จบส่วนของ panel_body

154


บทที่ 8 workshop iService www.javathailand.com

เริ่มต้นสร้าง form

วาง input ลงไป 1 อัน

วางปุ่มบันทึกลงไป

วาง hidden reld ลงไป และจบการสร้างฟอร์ม

ทำการสร้าง model

155


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดลงไปดังนี้ /app/protected/models/Group.php

ส่วนที่ใช้สร้าง model object

ผูกกับตาราง

กำหนดการแสดงของ column ต่าง ๆ เมื่อต้องนำไปใช้งาน

156


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดเพื่อบันทึก

เขียนโค้ดสร้าง Tree Data

เริ่มทำการ loop

สร้างตัวแปร $html

157


บทที่ 8 workshop iService www.javathailand.com

เพิ่มช่องว่างลงในตัวแปร $html

ใส่รายการ และปุ่มต่อท้าย

จบการทำงานของ function

158


บทที่ 8 workshop iService www.javathailand.com

สร้าง function ในการดึงรายการย่อยแต่ละ group

รายการตัวเลือกชั้นในสุดของ tree

จบการเขียนโค้ดของ model นี้

159


บทที่ 8 workshop iService www.javathailand.com

ทดสอบการทำงานของระบบ เมื่อกดเพิ่มรายการ

เราสามารถเลือกทำการ เพิ่มรายการย่อยลงไปกี่ลำดับชั้นก็ได้ครับ เพราะ เขียนแบบ recursive function จัดการข้อมูลประเภทงานซ่อม หน้าจอต้นแบบ

160


บทที่ 8 workshop iService www.javathailand.com

ทำการแก้ไข controller

เขียนโค้ดเพิ่มเข้าไปอีกดังนี้ /app/protected/controllers/ConrgController.php

ส่วนของ Form ในการเพิ่ม และแก้ไขรายการ

161


บทที่ 8 workshop iService www.javathailand.com

กรณีทำการแก้ไข

กำหนดค่าลงไป และทำการบันทึก

สร้าง object และทำการค้นข้อมูลมาเก็บใน $model

render และจบ function

162


บทที่ 8 workshop iService www.javathailand.com

เขียน function ในการลบรายการ เพิ่มเข้าไปอีก

ทำการสร้าง view

เขียนโค้ดลงไปดังนี้ /app/protected/views/conrg/RepairType.php นำ toolbar มาวาง

วางปุ่มในการเพิ่มรายการลงไป

163


บทที่ 8 workshop iService www.javathailand.com

เริ่มการสร้าง CGridView

กำหนด column ต่าง ๆ โดยเริ่มจาก ชื่อประเภทงานซ่อม

ตามด้วยปุ่มแก้ไข

และปุ่มลบ

จบหน้าจอนี้

164


บทที่ 8 workshop iService www.javathailand.com

ผลของโค้ดที่เขียนกันมา

ต่อมาก็คือเขียนส่วนที่เป็น Form เพื่อให้เพิ่มรายการ และแก้ไขรายการได้

เขียนโค้ดลงไปดังนี้ /app/protected/views/conrg/RepairTypeForm.php

165


บทที่ 8 workshop iService www.javathailand.com

วาง toolbar ลงไป

เริ่มต้นฟอร์ม

วาง textbox ลงไป

วางปุ่มกดบันทึกลงไป

จบฟอร์ม และจบหน้านี้

166


บทที่ 8 workshop iService www.javathailand.com

สร้าง model เพิ่มมาอีก

/app/protected/models/RepairType.php เริ่มต้น class

สร้าง constructor เพื่อใช้ในการสร้าง model

เชื่อมโยงกับตาราง

167


บทที่ 8 workshop iService www.javathailand.com

เชื่อมโยง column กับการแสดงผลข้อความต่าง ๆ ผูกเข้ากับ label

function ใช้ในการค้นหาข้อมูล

จบ class

ทดสอบการทำงาน เมื่อเรากดเพิ่มรายการ หรือแก้ไขรายการก็จะพบหน้านี้

168


บทที่ 8 workshop iService www.javathailand.com

ส่วนจัดการประเภทงานโปรเจค หน้าจอต้นแบบ

เริ่มต้นก็เขียนโค้ดเสริมเข้าไปอีกใน ConrgController

/app/protected/controllers/ConrgController.php

169


บทที่ 8 workshop iService www.javathailand.com

เขียนส่วนของหน้าหลัก

ส่วนของ Form

สร้าง $model object

ทำการ render ไปยัง view

170


บทที่ 8 workshop iService www.javathailand.com

function ในการลบ

สร้าง model เพื่อจัดการ ProjectType

/app/protected/models/ProjectType.php เริ่มต้นสร้าง class

สร้าง constructor เพื่อให้สามารถ create model ได้

171


บทที่ 8 workshop iService www.javathailand.com

ผูกเข้ากับตาราง

กำหนด attributeLabels

function ในการค้นหารายการ

จบการทำงานของ class

ทำการสร้าง view ProjectType.php

172


บทที่ 8 workshop iService www.javathailand.com

/app/protected/views/conrg/ProjectType.php วาง toolbar ลงไป

วางปุ่มเพิ่มรายการลงไป

เริ่มสร้าง CGridView

กำหนด column ชื่อประเภทโปรเจค

วางปุ่ม edit ลงไป

วางปุ่ม delete ลงไป

173


บทที่ 8 workshop iService www.javathailand.com

จบการแสดง CGridView และจบการทำงานของจอนี้

สร้างไฟล์ view

/app/protected/views/conrg/ProjectTypeForm.php วาง toolbar ลงไป

เริ่มสร้าง panel_body และส่วนของ Form

สร้างช่องกรอกข้อมูล

174


บทที่ 8 workshop iService www.javathailand.com

สร้างปุ่มกดบันทึก

จบการทำงานของฟอร์ม และจบหน้าจอนี้

เมื่อเราทำการกดปุ่มเพิ่ม หรือแก้ไขรายการ ก็จะได้หน้าจอนี้

ระบบจัดการประเภทวัสดุ / อุปกรณ์ ใช้ในการบริหารจัดการประเภทของวัสดุ อุปกรณ์ เวลาที่เราต้องใช้ เพื่อขึ้นทะเบียนอุปกรณ์ต่าง ๆ ในหน่วยงาน เพื่อให้เป็นหมวดหมู่ เลยต้องมี ประเภทมาใช้ในการจัดกลุ่ม หน้าจอต้นแบบ

175


บทที่ 8 workshop iService www.javathailand.com

ทำการเขียนโค้ดเพิ่มอีกใน controller

เขียนโค้ดลงไปดังนี้ /app/protected/controllers/ConrgController.php หน้าหลัก

176


บทที่ 8 workshop iService www.javathailand.com

ส่วนของฟอร์ม

ส่วนของการ render

ส่วนของการลบรายการ

177


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้าง model

/app/protected/models/DeviceType.php เริ่มสร้าง class

สร้าง constructor เพื่อให้สร้าง model ได้

เชื่อมกับตาราง

178


บทที่ 8 workshop iService www.javathailand.com

กำหนด attributelabels

เขียนโค้ดเพื่อค้นหารายการ

ดึงข้อมูลไปแสดงใน dropdownList

จบการทำงานของ class

ทำการสร้าง view

179


บทที่ 8 workshop iService www.javathailand.com

เริ่มเขียนโค้ดลงไป /app/protected/views/conrg/DeviceType.php วาง toolbar ลงไป

เริ่มส่วนของ panel_body

เริ่มเขียนส่วนของ CGridView

แสดง device_type_name แสดงปุ่ม แก้ไข

180


บทที่ 8 workshop iService www.javathailand.com

เพิ่มปุ่มลบลงไป

จบการทำงานของหน้าจอนี้

ต่อมาก็คือสร้างหน้าจอที่เป็นฟอร์ม เพื่อให้กรอกข้อมูลใหม่ และแก้ไข รายการได้

เขียนโค้ดลงไป /app/protected/views/conrg/DeviceTypeForm.php วาง toolbar ลงไป

181


บทที่ 8 workshop iService www.javathailand.com

เริ่มสร้างส่วนของ panel_body

เริ่มสร้าง form

วาง textbox ลงไป

วางปุ่มกดบันทึกลงไป

จบฟอร์ม

182


บทที่ 8 workshop iService www.javathailand.com

ส่วนของการจัดการผู้ใช้ระบบ ใช้ในการบริหารจัดการผู้ใช้ระบบ ทั้งระดับ Admin, User, Engineer และยังแก้ไข ลบรายการได้ด้วย หน้าจอต้นแบบ

เริ่มแรกเราทำการสร้าง model กันก่อน

เขียนโค้ดลงไปดังนี้ /app/protected/models/Employee.php เริ่มต้นสร้าง class

183


บทที่ 8 workshop iService www.javathailand.com

สร้าง function model

ผูกเข้ากับตาราง

กำหนดข้อความให้กับฟิลด์ต่าง ๆ

เขียน function เพื่อใช้ในการค้นหา

184


บทที่ 8 workshop iService www.javathailand.com

กำหนดความสัมพันธ์ระหว่างตาราง Group แบบ BELONGS_TO

สร้าง function เมื่อ beforeValidate

เขียน function เพื่อดึงข้อมูลมาแสดงแบบ option

เขียน function เพื่อใช้ในการดึงชื่อเพศ ของแต่ละคน

185


บทที่ 8 workshop iService www.javathailand.com

จบการทำงานของ class model

ต่อมาทำการเพิ่มโค้ดลงไปใน controller อีก

/app/protected/controllers/ConrgController.php หน้าหลักของ employee

action ใช้ในการลบรายการ

186


บทที่ 8 workshop iService www.javathailand.com

action ในการเปิดดูข้อมูล

ต่อมาทำการเขียนโค้ดเพิ่มอีกใน MemberController.php

เขียนโค้ดเพิ่มลงไปอีกดังนี้ /app/protected/controllers/MemberController.php

187


บทที่ 8 workshop iService www.javathailand.com

ส่วนของการแก้ไข โพรไฟล์ ตัวเอง

ต่อมาก็ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/conrg/Employee.php วาง toolbar ลงไป

วางปุ่มเพิ่มรายการลงไป

188


บทที่ 8 workshop iService www.javathailand.com

เริ่มส่วนของ CGridView

วาง column code ลงไป

ตามด้วย column ต่าง ๆ อีก

วางปุ่มแก้ไขลงไป

วางปุ่มลบลงไป

189


บทที่ 8 workshop iService www.javathailand.com

จบการทำงานของ CGridView และจบไฟล์นี้

ต่อมาทำการสร้าง view อีก

เขียนโค้ดลงไป /app/protected/views/conrg/EmployeeView.php วาง toolbar ลงไป

เริ่ม panel_body และสร้างฟอร์ม

employee group

employee_sex

190


บทที่ 8 workshop iService www.javathailand.com

employee_fname

employee_lname

employee_code

employee_username

employee_email

employee_tel

employee_image

191


บทที่ 8 workshop iService www.javathailand.com

จบการทำงานของฟอร์มนี้

ทดสอบการทำงานของหน้าหลัก

เมื่อกดเพิ่มผู้ใช้งาน

192


บทที่ 8 workshop iService www.javathailand.com

เมื่อกดที่รหัสผู้ใช้งาน

เมื่อกดแก้ไขผู้ใช้งาน

193


บทที่ 8 workshop iService www.javathailand.com

เมื่อกดที่ ข้อมูลส่วนตัว (เมนูซ้ายมือ) ระบบจะแสดงข้อมูลของผู้ที่เข้าระบบ

เพียงเท่านี้ก็จบแล้วครับ ส่วนของการจัดการผู้ใช้งานระบบ ในส่วนอื่น ๆ ต่อ ไปก็จะเป็นเรื่องของระบบการทำงานประจำวัน ได้แก่การแจ้งซ่อม รับแจ้ง รับเรื่อง บันทึกค่าใช้จ่าย ดูรายงาน และอื่น ๆ ครับ เดี๋ยวลองมาทำกันเลย

194


บทที่ 8 workshop iService www.javathailand.com

หน้าหลัก ใช้ในการจัดการข้อมูลประจำวันทั้งหมด โดยแบ่งแยกออกเป็น Tab ต่าง ๆ ครับ หน้าจอต้นแบบ

เริ่มสร้างส่วนของ controllers

เขียนโค้ดลงไป /app/protected/controllers/HomeController.php เริ่มต้นสร้าง class

195


บทที่ 8 workshop iService www.javathailand.com

หน้าหลัก

สร้าง function หน้าฟอร์มแจ้งซ่อม

ลบรายการที่แจ้งซ่อมได้

196


บทที่ 8 workshop iService www.javathailand.com

สร้าง view

หน้าหลัก

ทำการสร้าง toolbar

197


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดลงไป /app/protected/views/home/toolbar.php เริ่มต้น button-toolbar

เมนูแจ้งซ่อม

เมนูประวัติแจ้งซ่อม

เมนูทะเบียนอุปกรณ์ (สำหรับ แอดมิน)

เมนูรับเรื่องที่แจ้ง (สำหรับ แอดมิน)

198


บทที่ 8 workshop iService www.javathailand.com

เมนูรับซ่อม และ ตรวจสอบ (สำหรับ แอดมิน)

เมนูปิดงาน (สำหรับ แอดมิน)

จบการทำงานของ toolbar

ทำการสร้าง view อีก

เขียนโค้ดลงไป /app/protected/views/home/RequestForm.php วาง toolbar ลงไป

199


บทที่ 8 workshop iService www.javathailand.com

เริ่มสร้าง $form object

สร้าง input components

วางปุ่มกดลงไป

จบการทำงานของฟอร์ม

ทำการสร้าง model

200


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดลงไป /app/protected/models/Device.php เริ่มต้นสร้าง class

สร้าง function model()

ผูกเข้ากับตาราง

กำหนด attributeLabels

201


บทที่ 8 workshop iService www.javathailand.com

กำหนด beforeValidate

กำหนด relation

function ในการค้นหา

สร้าง getOptions และจบการทำงานของ class

202


บทที่ 8 workshop iService www.javathailand.com

ต่อมาทำการสร้าง model

เขียนโค้ดลงไป /app/protected/models/Request.php เริ่มต้น class

สร้าง function model

ผูกเข้ากับตาราง

กำหนดเงื่อนไขการกรอกข้อมูล

203


บทที่ 8 workshop iService www.javathailand.com

กำหนดค่าให้กับ column

กำหนด relation

สร้าง function ในการค้นหา

204


บทที่ 8 workshop iService www.javathailand.com

ค้นหารายการที่ได้ส่งคำร้องขอเข้าไป

ค้นหารายการที่รับเรื่องแล้ว

ค้นหารายการที่ปิดเรื่องแล้ว

205


บทที่ 8 workshop iService www.javathailand.com

ค้นหาประวัติการแจ้งซ่อมของตัวเอง

ค้นหารายการที่ปิดงานแล้ว

กำหนด beforevalidate

206


บทที่ 8 workshop iService www.javathailand.com

ปุ่มแก้ไขรายการที่แจ้งซ่อมเข้าไป

ปุ่มลบรายการที่แจ้งซ่อมเข้าไป

ดึงค่า สถานะ เป็นภาษาไทย

ค้นหารายการที่ซ่อม กรองตามปี เดือน ได้

207


บทที่ 8 workshop iService www.javathailand.com

นับจำนวนที่ส่งคำขอเข้ามา

นับจำนวนที่ซ่อมแล้ว

นับจำนวนที่ซ่อมเสร็จแล้ว

นับจำนวนงานที่ปิดเรียบร้อยแล้ว

208


บทที่ 8 workshop iService www.javathailand.com

นับจำนวนงานค้าง

ปุ่มกดดูรายละเอียดของรายการ

จบการทำงานของ class

209


บทที่ 8 workshop iService www.javathailand.com

ประวัติรายการที่แจ้งซ่อม ในส่วนนี้จะเป็นการดึงข้อมูลประวัติการแจ้งซ่อม ของผู้ login ขึ้นมา แสดงเพื่อดูว่าเคยแจ้งอะไรไปแล้วบ้าง และผลการซ่อมขณะนี้เป็นอย่างไร พร้อมกับสามารถเปิดดูรายละเอียดต่าง ๆ ได้ด้วยครับ หน้าจอต้นแบบ

เมื่อกดดูข้อมูล โดยการคลิกที่ รหัสอุปกรณ์

210


บทที่ 8 workshop iService www.javathailand.com

เอาล่ะครับ เรามาเร่ิมกันเลย อันดับแรกก็เขียนโค้ดเพิ่มเข้าไปอีกใน controller

เขียนโค้ดลงไป /app/protected/controllers/HomeController.php หน้าหลักระบบเช็คประวัติการแจ้งซ่อม

หน้าฟอร์มในการดูข้อมูล เมื่อคลิก ที่รหัส

211


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestHistory.php วาง toolbar ลงไป

เริ่มต้นส่วนของ panel_body และกำหนด CGridView

column แรกปุ่มเปิดดูข้อมูล

212


บทที่ 8 workshop iService www.javathailand.com

column ชื่อยี่ห้ออุปกรณ์ พร้อมชื่ออุปกรณ์

column สาเหตุอาการเสีย

column วันที่บันทึกรายการ

column ปุ่มแก้ไข

column ปุ่มลบ

213


บทที่ 8 workshop iService www.javathailand.com

จบการแสดง CGridView

เริ่มแสดงรายการที่ปิดไปแล้วบน CGridView

column กดดูรายละเอียด

column แสดงชื่อยี่ห้อ และชื่ออุปกรณ์

column แสดงปัญหาที่แจ้งซ่อม

214


บทที่ 8 workshop iService www.javathailand.com

column แสดงวันที่บันทึกรายการ

จบการทำงานของ CGridView และจบการทำงานของหน้าเพจนี้

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestHistoryForm.php วาง toolbar ลงไป

215


บทที่ 8 workshop iService www.javathailand.com

เริ่มสร้าง Form

แสดงชื่ออุปกรณ์

แสดงชื่อผู้แจ้งซ่อม

แสดงปัญหา

แสดงรายละเอียด

216


บทที่ 8 workshop iService www.javathailand.com

แสดงวันที่บันทึก

แสดงวันที่รับเรื่อง

แสดงวันที่รับซ่อม

แสดงวันที่ซ่อมเสร็จ

แสดงสาเหตุอาการเสีย

217


บทที่ 8 workshop iService www.javathailand.com

แสดงรายละเอียดการซ่อม

แสดงหมายเหตุ

แสดงสถานะ

จบการทำงานของฟอร์ม และจบเพจนี้

218


บทที่ 8 workshop iService www.javathailand.com

ระบบทะเบียนอุปกรณ์ ใช้ในการขึ้นทะเบียนอุปกรณ์เวลามีทำการซื้อเข้ามายังหน่วยงาน โดย จะกรอกข้อมูลพื้นฐานไว้เพื่อใช้ในการซ่อมแซม แจ้งบำรุงรักษาในลำดับถัด ไป หน้าจอต้นแบบ

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/DeviceList.php วาง toolbar ลงไป

219


บทที่ 8 workshop iService www.javathailand.com

เริ่มส่วนของ panel_body

เริ่มสร้าง CGridView

แสดงค่าของ column ต่าง ๆ

column วันที่ซื้ออุปกรณ์เข้ามา

column วันหมดประกัน

220


บทที่ 8 workshop iService www.javathailand.com

ปุ่มแก้ไข

ปุ่มลบ

จบการทำงานของ CGridView และจบเพจนี้

ทำการสร้าง view

221


บทที่ 8 workshop iService www.javathailand.com

ทำการเขียนโค้ดลงไป /app/protected/views/DeviceForm.php วาง toolbar ลงไป

สร้าง ActiveForm

รับค่า device_type_id

รับค่า device_name

รับค่า device_brand_name

รับค่า device_code

222


บทที่ 8 workshop iService www.javathailand.com

รับค่า device_record_code

รับค่า device_price

รับค่า device_buy_date

วางปุ่มบันทึกลงไป

จบการทำงานของฟอร์ม และจบเพจนี้

ต่อมาทำการเขียนโค้ดเพิ่มลงใน controllers

เริ่มต้น function และสร้าง object

223


บทที่ 8 workshop iService www.javathailand.com

เขียนส่วนของการบันทึกรายการ

กำหนดค่าให้กับ object

ส่วนของการ render

หน้าหลักทะเบียนอุปกรณ์

ลบทะเบียนอุปกรณ์

224


บทที่ 8 workshop iService www.javathailand.com

ระบบรับเรื่องที่แจ้งเข้ามา ใช้ในการตรวจสอบรายการที่มีการแจ้งซ่อมเข้ามา และทำการรับเรื่อง พร้อมกับระบุว่าจะให้ช่างซ่อมคนใด เป็นคนซ่อมรายการนั้น หน้าตาต้นแบบ จะเป็นดังนี้

เมื่อกดที่รหัสอุปกรณ์

225


บทที่ 8 workshop iService www.javathailand.com

เริ่มต้นก็เขียนโค้ดเพิ่มลงใน controllers

เขียนโค้ดลงไป /app/protected/controllers/HomeController.php หน้าหลัก

หน้าฟอร์มในการบันทึกรับเรื่อง

226


บทที่ 8 workshop iService www.javathailand.com

เพิ่มโค้ดลงใน model

เขียนโค้ดลงไป /app/protected/models/Request.php เขียนโค้ดดังนี้

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestGetRequest.php วาง toolbar ลงไป

227


บทที่ 8 workshop iService www.javathailand.com

เริ่มสร้าง CGridView

column รหัสอุปกรณ์

column ชื่อยี่ห้อ และอุปกรณ์

column ปัญหาอาการเสีย

column วันที่บันทึกรายการ

228


บทที่ 8 workshop iService www.javathailand.com

column สถานะ

จบการทำงานของ CGridView และจบเพจนี้

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestGetRequestForm.php วาง toolbar ลงไป

229


บทที่ 8 workshop iService www.javathailand.com

เริ่มส่วน panel_body และเริ่มฟอร์ม

แสดง device_id

แสดง employee_id

แสดง request_problem

แสดง request_detail

230


บทที่ 8 workshop iService www.javathailand.com

แสดง request_created_date

แสดง request_get_date

แสดง engineer_id

วางปุ่มบันทึกลงไป

จบการทำงานของฟอร์ม และจบเพจนี้

231


บทที่ 8 workshop iService www.javathailand.com

ส่วนของการรับซ่อม/ตรวจสอบ ใช้ในการรับซ่อมรายการที่ได้ผ่านการรับเรื่องมาแล้วเรียบร้อย และ สามารถเช็คสถานะของงานได้ด้วย หน้าจอต้นแบบ

เมื่อคลิกที่รหัส

232


บทที่ 8 workshop iService www.javathailand.com

ทำการเขียนโค้ดเพิ่มใน controllers

เขียนโค้ดลงไป /app/protected/controllers/HomeController.php หน้าหลัก

เริ่มสร้าง model

เริ่มรับซ่อม

เริ่มซ่อม

233


บทที่ 8 workshop iService www.javathailand.com

ทำการเคลม

จบการซ่อม

ทำการบันทึกรายการ

ส่วนของการ render

เพิ่มโค้ดลงอีกใน model

234


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดลงไป /app/protected/models/Request.php ปุ่มกดดูข้อมูล

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestGetRepair.php วาง toolbar ลงไป

เริ่มวาง CGridView ลงไป

235


บทที่ 8 workshop iService www.javathailand.com

ปุ่มกดดูข้อมูล

แสดง employee_id

แสดง สาเหตุอาการเสีย

แสดง วันที่บันทึกรายการ

แสดง สถานะ

จบการทำงานของ CGridView และจบเพจนี้

236


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestGetRepairForm.php วาง toolbar ลงไป

เริ่มสร้าง CActiveForm

แสดง device_code

237


บทที่ 8 workshop iService www.javathailand.com

แสดง device_name

แสดง employee_name

แสดง request_problem

แสดง request_detail

แสดงวันที่บันทึก และวันที่รับเรื่อง

238


บทที่ 8 workshop iService www.javathailand.com

แสดงวันที่ซื้อ และวันหมดประกัน

แสดงวันที่เริ่มซ่อม

ถ้าสถานะเป็นการรับเรื่องแล้ว ก็ให้แสดงปุ่มว่า รับซ่อมรายการนี้

ถ้ารับซ่อมแล้ว ก็เริ่มแสดงช่องกรอกต่าง ๆ เพิ่มอีก โดยเริ่มจากสาเหตุ อาการเสีย

239


บทที่ 8 workshop iService www.javathailand.com

แสดงรายละเอียดการซ่อม

แสดงรายการส่งเคลม

เลือก check สถานะว่าซ่อมเสร็จแล้ว

วางปุ่มบันทึกรายการ และจบการทำงานของ if

จบการทำงานของฟอร์ม และจบเพจนี้

240


บทที่ 8 workshop iService www.javathailand.com

ระบบปิดงานซ่อมเสร็จ ใช้ในการบันทึกปิดงานรายการที่ซ่อมเสร็จแล้ว โดยสามารถลงบันทึก หมายเหตุ ได้ด้วย หน้าจอต้นแบบ

เมื่อกดที่รหัส

241


บทที่ 8 workshop iService www.javathailand.com

ทำการเขียนโค้ดเพิ่มอีกใน controllers

เขียนโค้ดเพิ่มลงไป /app/protected/controllers/HomeController.php หน้าหลักการปิดงาน

หน้าฟอร์มเพื่อบันทึกปิดงาน

242


บทที่ 8 workshop iService www.javathailand.com

เขียนโค้ดเพิ่มอีกในไฟล์ model

เขียนโค้ดลงไป /app/protected/models/Request.php สร้างปุ่มเพื่อกดดูข้อมูลการปิดงาน

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestRepairEnd.php

243


บทที่ 8 workshop iService www.javathailand.com

วาง toolbar ลงไป

เริ่มวาง CGridView

column device_code

column employee_id

column request_problem

column request_created_date

244


บทที่ 8 workshop iService www.javathailand.com

column request_status

จบการทำงานของ CGridView และจบเพจนี้

ทำการสร้าง view

เขียนโค้ดลงไป /app/protected/views/home/RequestRepairEndForm.php วาง toolbar ลงไป

245


บทที่ 8 workshop iService www.javathailand.com

สร้าง CActiveForm

device_id

employee_id

request_problem

request_detail

246


บทที่ 8 workshop iService www.javathailand.com

request_created_date

request_get_date

request_start_repair_date

request_end_repair_date

request_answer

247


บทที่ 8 workshop iService www.javathailand.com

request_repair_detail_work

request_end_remark

วางปุ่มบันทึกลงไป

จบการทำงานของ CGridView และจบเพจนี้

248


บทที่ 8 workshop iService www.javathailand.com

ส่วนของระบบรายงาน หน้าจอต้นแบบ

ทำการแก้ไขโค้ดของ model

ไฟล์ /app/protected/models/Request.php แก้โค้ดดังนี้

249


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้าง ReportController

ไฟล์ /app/protected/controllers/ReportController.php เขียนโค้ดลงไปดังนี้

250


บทที่ 8 workshop iService www.javathailand.com

ทำการสร้าง view

ไฟล์ /app/protected/views/report/toolbar.php เขียนโค้ดลงไป

ทำการสร้าง view

ไฟล์ /app/protected/views/report/Repair.php

251


บทที่ 8 workshop iService www.javathailand.com

วาง toolbar ลงไป

เริ่มสร้างฟอร์ม เพื่อกรองข้อมูล

วาง CGridView ลงไป

request_created_date

device_code

252


บทที่ 8 workshop iService www.javathailand.com

device_id

employee_id

request_status

จบการแสดงผล CGridView

เลขสรุป

253


บทที่ 8 workshop iService www.javathailand.com

แสดงงานคงค้าง และจบเพจนี้

ปิดท้ายบท นี่ก็เป็นบทสุดท้ายแล้วครับ มาถึงหน้านี้จนได้ หลังจากที่ผมนั่งเขียน หนังสือเล่มนี้เป็นเวลาเกือบ 2 เดือน ที่ทุ่มเทเขียนทุกวัน จนดึกดื่น ถึงแม้ว่า เนื้อหาในหลาย ๆ ส่วนอาจจะยังขาดบางอย่างไป แต่ก็นั่นไม่ได้หมายความว่า มันจะจำเป็นมากมายนัก เพราะในตำราเล่มนี้ ผมได้คัดเอาเฉพาะสิ่งที่จำเป็น ต้องรู้ให้ได้ ณ โอกาสนี้ผมขออวยพรให้ผู้อ่านทุกคน ประสบความสำเร็จในการนำ เอา Yii Framework ไปใช้งานในงานที่ต้องการ อย่างรวดเร็วที่สุด เนื้อหา ทั้งหมดนี้ก็เพียงพอให้นำไปศึกษา พัฒนาต่อยอดได้ในอนาคต หากติดขัด หรือมีข้อสงสัย หรือแม้แต่ข้อเสนอแนะ ก็สามารถเมล์มาหาผมได้เสมอที่ thekaroe@hotmail.com ครับ ยินดีตอบให้ทุกฉบับ คงมีเพียงไม่กี่คนเท่านั้นที่อ่านตำรารอบเดียว ทำตาม แล้วนำไปใช้ สร้างผลงานได้เลย ดังนั้นผมขอย้ำว่า ควรอ่านอีกสักรอบ หรือลองทำระบบ จริง ๆ ดูเมื่อถึงคราวติดขัดก็มาเปิดตำราเล่มนี้เพื่อช่วยหาทางออกให้กับ ปัญหาที่พบเจอ เมื่อผู้อ่านได้ใช้งาน Yii Framework ไปเรื่อย ๆ แล้วจะพบว่า มันมีความสามารถเหนือล้ำจริง ๆ และมีอีกหลายอย่างมากที่อลังการจนผม เองต้องยกไปเขียนในเล่มต่อไป หากมีโอกาสก็หวังเป็นอย่างยิ่งว่า คงได้มีผลงานออกมาให้รับชมกันใน คราวหน้า และหวังเป็นอย่างยิ่งอีกว่า จะได้รับการตอบรับด้วยดีจากท่านผู้ อ่านทุก ๆ ท่าน บรรทัดสุดท้ายนี้ ผมขอกล่าวคำว่า สวัสดีครับ

254


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.