แต่ง select box ให้สวยและค้นหา option ได้ด้วย

วันนี้มีตัวช่วยสร้าง select box ของเราให้เป็นตัวเลือกแบบสวยๆ
และสามารถค้นหา option ด้วยคำที่ต้องการได้ด้วย

ตามไปดูตัวอย่างได้ที่ https://select2.github.io/examples.html

ถ้าให้แนะนำคงจะเป็นส่วนของการเพิ่ม "Placeholders" และ สามารถเคลียร์ค่าได้ด้วย allowClear ซึ่งจะต้องสร้าง option เปล่าๆไว้ 1 ตัว จะทำให้ปรากฏเครื่องหมายกากบาท สำหรับล้างค้าที่เลือกไปแล้วได้ด้วย

สำหรับวิธีติดตั้งก็ดูที่หน้า "Home" ได้เลยครับ https://select2.github.io/

ไฟล์ที่ต้องการก็มี select2.min.css

และสคริปต์ select2.min.js

ส่วนการเรียกใช้ก็ง่ายๆ

<script type="text/javascript">
  $('select').select2();
</script>

สำหรับการปรับแต่งเพิ่มเติมก็ดูตาม https://select2.github.io/options.html หรือแกะไปตาม Examples เอาละกันนะครับว่าเรียกใช้ยังไงบ้าง

และที่สำคัญหากนำมาใช้แล้วแสดงผลแล้วไม่เหมือนตัวอย่าง อาจจะเป็นเพราะต้องใช้ไฟล์ bootstrap และสัญลักษณ์ต่างๆจาก font-awesome เข้ามาช่วยด้วยนะครับ

ความคิดเห็น

โพสต์ยอดนิยมจากบล็อกนี้

แจกฟรี!! ระบบต่างๆที่พัฒนาด้วย PHP สำหรับนำไปใช้ในงานต่างๆ

สำหรับหลายท่านที่ขอโค้ดเข้ามาทาง Inbox ของเฟซบุ๊กแฟนเพจ หรือถามถึงระบบต่างๆหลังไมค์มานั้น ส่วนใหญ่ก็มีแจกอยู่แล้วในเว็บบอร์ด ThaiCreate.Com นะครับ และด้านล่างนี้ก็เป็นระบบต่างๆที่แจกให้นำไปลองใช้ลองศึกษากันครับ

สร้างแบบฟอร์มล็อกอิน HTML + PHP

ผมจะสร้างระบบตัวอย่างเพื่อแสดงให้เห็นการทำงานของสคริปต์ PHP ที่ใช้ในการล็อกอินอย่างง่ายๆ นะครับ โดยที่ผมจะสร้างโฟลเดอร์ใหม่ขึ้นในไดร์ฟที่เราได้กำหนดให้เป็น Directory Root สำหรับรันสคริปต์ PHP ซึ่งผมกำหนดเอาไว้ที่ D:\www ดังนั้นผมจะสร้างโฟลเดอร์ teacher_assistant ขึ้นมาใหม่จะได้พาธเป็น D:\www\teacher_assistant สำหรับการเข้าถึง จะใช้ URL ดังนี้ http://localhost/teacher_assistant หลังจากสร้างโฟลเดอร์เสร็จเรียบร้อยก็จะเริ่มกระบวนการเตรียมโครงสร้างโปรเจ็กต์ด้วยเครื่องมือช่วยเขียนโปรแกรมชื่อว่า eclipse ซึ่งดูวิธีการสร้างโปรเจ็กต์ได้จากบทความ เริ่มต้นสร้างโปรเจ็กต์ ด้วยโปรแกรม eclipse เครื่องมือเขียนโปรแกรม php ในบทความเป็นการสร้างโปรเจ็กต์ที่มีพาธเป็นโฟลเดอร์ login แต่ในที่นี้ต้องเป็นพาธให้ตรงกับโฟลเดอร์ใหม่ที่เราได้สร้างขึ้นด้วยนะครับ

PHP กับการคิดส่วนลดเป็นเปอร์เซ็น 5%, 10%, 20% ตามช่วงราคาที่กำหนด

<?php $total_price = 1000; $discount = 0; if($total_price >= 500 && $total_price < 1001){ $discount = 5; }elseif($total_price >= 1001 && $total_price <= 5000){ $discount = 10; }elseif($total_price >= 5001){ $discount = 20; } $discount_bath = ($total_price*$discount)/100; ?> <pre> ซื้อสินค้าครบ 0 ถึง 499 บาท ไม่ได้ส่วนลด ซื้อสินค้าครบ 500 ถึง 1000 บาท ได้ส่วนลด 5% ซื้อสินค้าครบ 1001 ถึง 5000บาท ได้ส่วนลด 10% ซื้อสินค้าครบ 5001 บาทขึ้นไป ได้ส่วนลด 20% </pre> <h3>รวมราคาสินค้า = <?php echo number_format($total_price,2);?></h3> <h5>ส่วนลด = <?php echo $discount;?>% (<?php echo $discount_bath;?> บาท)</h5> <h2>ราคาหลังส่วนลด = <?php echo number_format($total_price - $discount_bath,2);?>บาท</h2> "PHP ไม่ได้สร้างสุดยอดโปรแกรม แต่ PHP ช่วยให้งานคุณง่ายขึ้นต

PHP วิถีเริ่มต้นของโปรแกรมเมอร์ รับทำเว็บไซต์

ค้นหาบล็อกนี้