น้องทำพี่เจ็บนะ ดิสซาเบลด

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

เป็นที่มาของเรื่อง น้องดิสซาเบล็ด

การจัดกลุ่มให้กับ List รายการ

ใน html มันมี แท็กตัวหนึ่ง คือ optgroup ไว้ใช้สำหรับจัดกลุ่มให้กับตัวเลือกแบบรายการเลื่อนลง โฮ่ๆ พูดซะยาก. อันที่จริงก็คือ Listbox นั่นแหละ

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

เราจะใช้ optgroup เป็นตัวช่วย ตัวตัวอย่างละกันเนอะ . ในตัวอย่างผมจะแบ่งกลุ่มของยานพาหนะออกเป็น รถมอเตอร์ไซต์ กับ รถยนต์

1
2
3
4
5
6
7
8
9
10
11

<select id="select" name="select">
  <optgroup label="รถมอเตอร์ไซด์">
  <option value="Yamaha" selected>Yamaha</option>
  <option value="Honda">Honda</option>
  <option value="Zusuki">Zusuki</option>
  </optgroup>
  <optgroup label="รถยนต์">
  <option value="Toyota">Toyota</option>
  <option value="Isuze">Isuze</option>
  </optgroup>
</select>

Insert image into button เพิ่มรูปภาพเข้าไปในปุ่ม

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

สงสัย สงสัย สงสัย หรือ ไม่เคยสงสัยเลย ???

เมื่อก่อนผมใช้บ่อยปุ่มแบบนี้ แต่พอนานเข้าๆ สมองชักลืมว่ามันมีวิธีใส่ภาพเข้าไปในปุ่ม วันนี้ท่องไปในโลกไซเบอร์ เจอปุ่มแบบนี้เข้าอีกครั้ง

ทำให้นึกขึ้นได้ เลยมาเขียนเป็นบทความซะ จะได้เตือนตัวเองด้วย

เท้าความหน่อยนะ แท็กที่ใช้ในการสร้างปุ่มของ html นั้น มีอยู่ 2 แท็ก คือ