GET form
De reden dat ik de naam niet kan veranderen is dat ik op deze manier de checkbox tel. En ik heb naar veel moeite en hulp javascript werkende gekregen. Dit is wat ik tot nu toe heb.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>Nieuwe pagina 2</title>
<style type='text/css'>
div {
width:20px;
height:20px;
padding:4px;
border:1px dashed #f00;
color:#000;
text-align:center;
cursor:pointer;
background-color:#000;
}
.white { background: #fff; }
.black { background: #000; }
</style>
<script type="text/javascript">
function clk(el,cl1,cl2,chbx_id){
el.className=(el.className==cl1)?cl2:cl1;
document.getElementById(chbx_id).checked = (el.className==cl1)?'':'checked';
}
</script>
<script type="text/javascript">
function checkAll(field)
{
for (var i = 0; i < field.length; i++)
{
field[i].checked = true ;
document.getElementById('test' + i).className = 'white';
}
}
function uncheckAll(field)
{
for (var i = 0; i < field.length; i++)
{
field[i].checked = false;
document.getElementById('test' + i).className = 'black';
}
}
En
</script>
</head>
<body>
<button onclick="checkAll(document.myform.checkbox)">Check All</button>
<button onclick="uncheckAll(document.myform.checkbox)">Check All</button>
<form name="myform" action="test2.htm" method="get">
<input type="submit" value="Click!" />
<br>
<div id="test0" class="black" onclick="clk(this,'black','white','my_checkbox')"></div>
<input type="checkbox" id="my_checkbox" name="checkbox"/>
<div id="test1" class="black" onclick="clk(this,'black','white','my_checkbox1')"></div>
<input type="checkbox" id="my_checkbox1" name="checkbox"/>
<div id="test2" class="black" onclick="clk(this,'black','white','my_checkbox2')"></div>
<input type="checkbox" id="my_checkbox2" name="checkbox"/>
<div id="test3" class="black" onclick="clk(this,'black','white','my_checkbox3')"></div>
<input type="checkbox" id="my_checkbox3" name="checkbox"/>
</form>
</body>
</html>
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>Nieuwe pagina 2</title>
<style type='text/css'>
div {
width:20px;
height:20px;
padding:4px;
border:1px dashed #f00;
color:#000;
text-align:center;
cursor:pointer;
background-color:#000;
}
.white { background: #fff; }
.black { background: #000; }
</style>
<script type="text/javascript">
function clk(el,cl1,cl2,chbx_id){
el.className=(el.className==cl1)?cl2:cl1;
document.getElementById(chbx_id).checked = (el.className==cl1)?'':'checked';
}
</script>
<script type="text/javascript">
function checkAll(field)
{
for (var i = 0; i < field.length; i++)
{
field[i].checked = true ;
document.getElementById('test' + i).className = 'white';
}
}
function uncheckAll(field)
{
for (var i = 0; i < field.length; i++)
{
field[i].checked = false;
document.getElementById('test' + i).className = 'black';
}
}
En
</script>
</head>
<body>
<button onclick="checkAll(document.myform.checkbox)">Check All</button>
<button onclick="uncheckAll(document.myform.checkbox)">Check All</button>
<form name="myform" action="test2.htm" method="get">
<input type="submit" value="Click!" />
<br>
<div id="test0" class="black" onclick="clk(this,'black','white','my_checkbox')"></div>
<input type="checkbox" id="my_checkbox" name="checkbox"/>
<div id="test1" class="black" onclick="clk(this,'black','white','my_checkbox1')"></div>
<input type="checkbox" id="my_checkbox1" name="checkbox"/>
<div id="test2" class="black" onclick="clk(this,'black','white','my_checkbox2')"></div>
<input type="checkbox" id="my_checkbox2" name="checkbox"/>
<div id="test3" class="black" onclick="clk(this,'black','white','my_checkbox3')"></div>
<input type="checkbox" id="my_checkbox3" name="checkbox"/>
</form>
</body>
</html>
Koh do op 04/04/2012 13:07:43:
Dit om dat de naam van mijn checkboxes allemaal het zelfde zijn.
Verschillende namen geven. Of maak er een array() van.