Vue.js: วนลูปด้วย For
ในการวนลูปด้วย Vue นั้นเราสามารถใช้ v-for ในการวนลูปได้ดังตัวอย่างต่อไปนี้ index.html <html> <head> <link rel="stylesheet" href="index.css">…
สอนทีละขั้น พร้อมโค้ดตัวอย่างที่คัดลอกไปใช้ได้ทันที
ในการวนลูปด้วย Vue นั้นเราสามารถใช้ v-for ในการวนลูปได้ดังตัวอย่างต่อไปนี้ index.html <html> <head> <link rel="stylesheet" href="index.css">…
สำหรับเงื่อนไขในการเขียนโปรแกรมใน Vue จะใช้คำสั่งที่เรียกว่า v-if นั่นเอง โดยมีตัวอย่างของการเขียนดังต่อไปนี้ index.html <html> <head> <link…
สำหรับบทเรียนรู้นี้มาสวัสดีชาวโลกหรือ Hello World กับ Vue.js กันนะครับ ในที่นี้จะใช้การเรียก Vue.js ผ่าน Browser โดยไม่ได้ติดตั้งผ่าน cli เพ…
ทดลองเรียกใช้ VueJS และทดลองเขียน ทดสอบการทำงาน See the Pen Vue01 by Manop Kongoon (@kongoon) on CodePen. Vue.js: สวัสดีชาวโลก! Vue.js: เงื่…
ในบทเรียนรู้นี้เรามาเรียนรู้การสร้างฟอร์มสำหรับการแก้ไขทีละหลายๆ record ด้วย Yii Framework ซึ่งเป็นการสร้าง input แบบ multiple input นั่นเอง…
ในบทเรียนรู้นี้เราจะมาสร้างลิ้งค์สำหรับเปลี่ยนภาษาในระบบ โดยทำงานร่วมกับ Package localeurls ซึ่งก่อนอื่นก็ติดตั้ง Package นี้เสียก่อนโดยพิมพ…
สำหรับ Yii Framework 2 นั้น โดยทั่วไปเราสามารถใช้ AccessControl ในการจัดการสิทธิ์การเข้าถึงได้เพียงแค่ตรวจสอบว่า login หรือ guest (ยังไม่ lo…
ในบทความนี้เป็นแนวทางในการนำ VueJS มาใช้ร่วมกันกับ Yii Framework 2 ในการโหลดข้อมูล API / JSON มาแสดงผลด้วย Axios โดยไม่ได้ Refresh หน้าเว็บ…
bower เป็น package js และ css ที่สามารถนำไปใช้ใน package ส่วนใหญ่ที่เป็น js web application เช่น nodejs เป็นต้น โดยการนำมาใช้กับ Yii Framewo…
ใน mPDF เราสามารถสร้าง QR Code แทน Barcode ได้โดยเปลี่ยน type ของ barcode ดังนี้ <?php $qr = 'data or link'; ?> <barcode code="<?=$qr?>" typ…
สำหรับบทเรียนรู้นี้เป็นการใช้งาน Apache Modules ในการบีบอัดเว็บไซต์ ให้เล็กลงก่อนส่งให้ Client (อาจไม่เกี่ยวกับ Yii2 นะครับ แต่ก็ใช้กับ Yii2…
สำหรับบทเรียนรู้นี้เรามาทำการรวมไฟล์ JavaScript และ ไฟล์ CSS เพื่อบีบอัดให้มีขนาดเล็กลง ซึ่งแน่นอนจะทำให้การโหลดเว็บไซต์ได้ไวมากยิ่งขึ้น โดย…
โครงสร้างไฟล์ ใน meteor นั้น mongoDB นั้นเป็นฐานข้อมูลที่มีมาพร้อมในขั้นตอนการติดตั้งเลย ดังนั้นเราสามารถเรียกใช้งานได้ทันที โดยเราจะสร้าง f…
ติดตั้ง Chocolatey สำหรับการติดตั้ง Meteor นั้นจะต้องทำการติดตั้ง Chocolatey ก่อนโดยสามารถติดตั้งผ่าน command prompt ได้โดยเข้าเว็บไซต์ http…
หลังจากที่เรียนรู้การแทรกรูปภาพแล้วในบทเรียนรู้นี้มาแทรกตารางเข้าไปในเอกสาร MS Word จาก MS Word Template กันครับ เริ่มจากการตั้งค่าไฟล์ MS W…
หลังจากที่ได้เรียนรู้วิธีการสร้างเอกสาร MS Word จาก MS Word Template ไปแล้ว (หากยังไม่ได้อ่าน สร้างไฟล์ MS Word จาก Word Template สำหรับงานเ…
sweet alert 2 เป็น css และ js ที่ช่วยในการทำ alert ต่างๆ ในที่นี้เราเปลี่ยน alert ใน yii framework 2 ไปใช้ sweet alert แทน https://limonte.g…
เนื่องจาก html2pdf ใช้ library จาก TCPDF มาเพิ่มเติมคำสั่งด้าน html css ให้สมบูรณ์ยิ่งขึ้น และการใช้งาน html2pdf จะต้อง import TCPDF ด้วย เร…
download จาก https://github.com/tecnickcom/tcpdf (เวอร์ชั่นที่เขียน 6.2.13 ) สร้างฟอนท์จาก tcpdf จากคำสั่งด่านล่าง โดยสั่งผ่าน command จากโฟ…
ปัญหานี้เกิดขึ้นเมื่อสมาชิก (user) เดียว แต่สามารถ login เข้าระบบได้จากหลายๆ เครื่อง หลายๆ browser ทำให้ไม่สามารถควบคุมการใช้งานได้ เช่น use…
โดยปกติเวลาที่เราออกจากระบบใน Yii Framework 2 นั้นจะต้องส่งข้อมูลไปแบบ POST โดยอาศัยฟอร์มในการส่งข้อมูล เช่นใน Nav $menuItems[] = '<li>' . H…
Bootstrap4 ใน Yii Framework 2 นั้นจะมาใน Yii version 2.1 ซึ่งก็คงต้องรออีกสักระยะ และประกอบกับ Bootstrap4 เอง ณ ตอนนี้ก็ยังเป็น version beta…
ตัวอย่างคำสั่ง SQL เพื่อนับจำนวนวันโดยไม่รวมวันเสาร์-อาทิตย์ และวันหยุด SELECT DATEDIFF(d, '2017-01-01', '2017-01-31') - DATEDIFF(wk, '2017-…
เอาล่ะครับ หลังจากที่ประสบปัญหากับการใช้งาน HTML to PDF ด้วย mPDF เนื่องจากไฟล์ PDF ไม่สามารถจัดรูปแบบได้อย่างคล่องตัวมากนัก เช่นคำตก จัดรูป…
ในขั้นตอนนี้เรามาสร้าง Angular App แรก กันโดยพิมพ์คำสั่ง ng new hello-world โดยที่ hello-world คือชื่อของ Project ที่เราต้องการสร้าง ซึ่ง ng…
ก่อนอื่น เราจะต้องติดตั้ง NodeJs กันก่อน เพื่อเป็นตัว runtime javascript ที่จะไปแสดงผลใน browser และเราจะใช้ nodejs ในการสร้าง project โดยเข…
สถาปัตยกรรมของ Web Application ในยุคใหม่นี้ประกอบไปด้วย 2 ส่วนใหญ่ๆ ด้วยกันนั้นคือ Front-end และ Back-end Front-end ทำงานที่ฝั่ง Client ผ่าน…
Angular คือ เฟรมเวร์ค (framework) สำหรับสร้างแอพลิเคชั่นในฝั่งไคลเอ็นในรูปแบบของ HTML, CSS และ JavaScript/TypeScript ซึ่ง TpyeScript จะถูก c…
หลายคนคงเจอปัญหาเมื่อมีการแก้ไขชนิดข้อมูล หรือการปรับเปลี่ยนข้อมูลในตาราง แล้วไม่สามารถแก้ไขได้โดยมีความความลักษณะดังนี้ Saving changes is n…
คำสั่งในการแทนที่ข้อความในคอลัมน์ ตัวอย่างนี้จะทำการปรับปรุงตาราง lib_book โดยจะแทนที่คำว่า /upload/lib/ เป็นค่าว่าง (เพราะต้องการแค่ชื่อรูป…
มีคนถามมาว่าเราสามารถสร้าง Application เหมือน frontend/backenc ได้ไหม แต่ใช้การตั้งค่าและ vendor เดียวกัน คำตอบคือสามารถทำได้ครับ เพื่อให้เข…
สำหรับยทเรียนรู้นี้มาทำให้ Web application เราให้สามารถออกจากระบบอัตโนมัติ โดยในที่นี้จะกำหนดให้ออกจากระบบหลังจากไม่ได้ใช้งานเป็นเวลา 5 นาที…
สำหรับการเพิ่มหน้าใหม่ใน mPDF นั้นสามารถทำได้โดยเรียกใช้ method AddPage() ซึ่งในที่นี้จะกำหนดให้หน้าใหม่เป็นแบบแนวนอน (Landscape) โดยมีการเข…
สำหรับการใส่รูปภาพใน mPDF นั้นสามารถทำได้ง่ายดายมาก เพียงใส่ tag html ในการแสดงรูปคือ <img> พร้อมระบุ path ไปยังรูปภาพให้ถูกต้อง ก่อนอื่นต้อ…
ในบทเรียนรู้นี้มาทำการติดตั้ง Laravel ผ่านโปรแกรม Composer กัน ความต้องการ สำหรับการใช้งาน Laravel นั้นมีความต้องการ PHP และ PHP Extension ต…
สำหรับบทเรียนรู้นี้เรามาใส่ Font TH Sarabun ใน mPDF เพื่อสร้างเอกสาร PDF กันครับ ซึ่งส่วนใหญ่แล้วงานราชการจะนิยมใช้ Font TH Sarabun กัน โดยเ…
สำหรับในบทเรียนรู้นี้เรามา upgrade website joomla 3.6.5 ไปเป็น joomla 3.7 ในแบบ online กันนะครับ ซึ่งก็มีขั้นตอนที่ไม่ซับซ้อน มาเริ่มกันเลยค…
ในบทเรียนรู้นี้เรามาทดลองการสร้างไฟล์ PDF เพื่อทดลองใช้งานภาษาไทย ในที่นี้จะใช้ข้อความจาก http://lorem.in.th/ ซึ่งเป็น Website ไว้สร้างข้อคว…
หลายๆ เว็บไซต์ จะเห็น URL ที่มีข้อความ เช่น www.example.com/post/view/1/ทดสอบ เป็นต้น ซึ่งเราจะเห็นว่ามีคำว่า ทดสอบ อยู่ใน URL ด้วย ส่วนใหญ่…
ปัญหาของ Autocomple ที่แสดงใน Modal คือ เมื่อมีการพิมพ์รายการ รายการต่างๆ ที่มีให้เลือกมันจะแสดงผลอยู่ข้างหลัง Modal ดังนั้นเราจะต้องนำมันออ…
mPDF คืออะไร mPDF เป็น PHP Package Class สำหรับการสร้างไฟล์ PDF จาก HTML ซึ่งตอบสนองการจัดรูปแบบต่างๆ ผ่าน Web Application ได้ สำหรับ PHP De…
สำหรับการใช้งาน domain ที่เป็น SSL ใน Yii framework 2 นั้นเราสามารถกำหนดใน server ที่เป็น apache ด้วยการเขียน .htaccess แล้ววางใน root ของ p…
สำหรับบทเรียนรู้นี้เรามาทดลองการแสดงข้อมูลจาก Google Analytics มาแสดงใน Web Application ของเราผ่าน API ของ Google ซึ่งมีขั้นตอนต่อไปนี้ ติดต…
ปุ่มหรือ Button ใน Bootstrap นั้นมีหลายสีสันให้เลือก ซึ่งเราสามารถกำหนด class ให้กับ element ต่างๆ ได้เช่น <a>, <button> และ <input> LinkBut…
ตารางพื้นฐาน สำหรับการสร้างตารางแบบพื้นฐานโดยใช้ Bootstrap จะมีเพียงเส้นบรรทัดกั้นแต่ละแถวเท่านั้นโดยเพียงเรียกใช้งาน .table คำอธิบายตาราง #…
บรรทัดเดียวกัน (Inline) ตัวอย่างโค๊ดในบรรทัดจะแสดงโดยใช้ Tag <code> ตัวอย่างคำสั่ง Tag <html> ในบรรทัดเดียวกัน ตัวอย่างคำสั่ง Tag <code><…
สำหรับการนำ Bootstrap ไปใช้ใน Webpage นั้นสามารถทำได้หลายช่องทาง โดยใช้เครื่องมือต่างๆ หรือจะดาวน์โหลดมาใช้งานโดยตรงก็ได้ โดยมาดูรายละเอียดต…
หัวเรื่อง (Heading) สำหรับการแสดงผล Tag h1 ถึง h6 ใน HTML นั้นสำหรับ Bootstrap จะแสดงผลลักษณะดังนี้ h1. Bootstrap heading Semibold 36px h2.…
ปัญหาอย่างหนึ่งของการสร้าง GridView หลายๆ ตัวในหน้าเดียวกันคือเมื่อมีการเลือก หน้า (Pagination) ทุกๆ GridView จะเปลี่ยนหน้าเหมือนกันหมด ในบท…