บทความนี้การทำ Link ที่ทำให้ Checkbox ไม่เลือกและเลือกทั้งหมดครับที่เหมือนกับ Mail ของ yahoo.com นะครับซึ่งหลายคงอยากรู้ทำกันยังไง มาทำกันเลยครับ
ขั้นตอนการทำ
1. สร้างไฟล์ demo.html เพื่อใช้ในการทดสอบ Script นะครับ แล้ว copy function javascript ด้านล่างนี้ เอาไว้ที่ tag <head> </head> นะครับ
<script>
function checkall(formname,checkname,thestate){
var el_collection=eval("document.forms."+formname+"."+checkname)
for (c=0;c<el_collection.length;c++)
el_collection[c].checked=thestate
}
</script>
หลังจาก copy function javascript มาวางไว้ที่ tag <head> </head> แล้วนะครับ จะต้องเหมือนกับ code ด้านล่างนะครับ
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>การทำ Link ให้ Checkbox ไม่เลือกและเลือกทั้งหมด</title>
<script>
function checkall(formname,checkname,thestate){
var el_collection=eval("document.forms."+formname+"."+checkname)
for (c=0;c<el_collection.length;c++)
el_collection[c].checked=thestate
}
</script>
</head>
<body>
</body>
</html>
2. หลังจากนั้นเรามาสร้าง Form ตั้งชื่อ Form ว่า "test" ซึ่งประกอบไปด้วย checkbox ที่จะใช้จำนวน 5 checkbox ตั้งชื่อ checkbox ว่า "v1" ตามรูปด้านล่าง
3. หลังจากนั้นเราก็มาทำ link กันครับ
<a href="javascript:checkall('test','v1',true)">เลือกทั้งหมด</a> // เป็นการให้ function javascript เลือกทั้งหมด
<a href="javascript:checkall('test','v1',false)">เอาออกทั้งหมด</a> // เป็นการให้ function javascript ไม่เลือกทั้งหมด
4. เสร็จแล้วครับ ลองเอาไปลองทำดูนะครับน่าจะมีประโยชน์บ้างนะครับ
