Verwijderen en toevoegen dmv checkbox
Dit is mijn (relevante) stukje datamodel:
Code (php)
1
2
3
4
2
3
4
orders
----------------------
leerling_id
product_id
----------------------
leerling_id
product_id
Dit is dus een koppel tabel. Bij aanvinken moet de order verwijderd worden, bij afvinken moet hij worden verwijderd.
Weet je hoe een checkbox zich gedraagt in javascript?
Weet je welke sql's je moet maken om de gegevens in de tabel te zetten/verwijderen?
Waar ligt het probleem vooral?
index.php
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
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
<?php
//...
// $leerling_id[] en zo zelf invullen
// bv.
$leerling_id[1] = 5;
$product_id[1] = 34;
switch ($_GET['pagina'])
{
default:
// formulier
echo '
<html>
<script src="js.js" language="javascript" type="text/javascript"></script>
<head>
<title>Ajax voorbeeldje</title>
</head>
<body >
...
<input type="hidden" id="leerling_id[1]" value="'. $leerling_id[1] .'"/>
<input type="hidden" id="product_id[1]" value="'. $product_id[1] .'"/>
<div><input type="checkbox" id="order[1]" onClick="toevoegen_verwijderen(1);" /> verwijderen / toevoegen </div>
...
<div id="message"></div>
</body>
</html>
';
break;
case 'toevoegen_verwijderen':
$leerling_id = $_POST['leerling_id'];
$product_id = $_POST['product_id'];
$checked = $_POST['checked']; // = 1 of 0
switch ($checked)
{
// in db steken
case 1:
// INSERT ...
echo 'INSERT INTO ...'; // puur als voorbeeld, om te tonen dat er iets gebeurt
break;
case 0:
// DELETE ...
echo 'DELETE FROM ...';
break;
}
break;
}
?>
//...
// $leerling_id[] en zo zelf invullen
// bv.
$leerling_id[1] = 5;
$product_id[1] = 34;
switch ($_GET['pagina'])
{
default:
// formulier
echo '
<html>
<script src="js.js" language="javascript" type="text/javascript"></script>
<head>
<title>Ajax voorbeeldje</title>
</head>
<body >
...
<input type="hidden" id="leerling_id[1]" value="'. $leerling_id[1] .'"/>
<input type="hidden" id="product_id[1]" value="'. $product_id[1] .'"/>
<div><input type="checkbox" id="order[1]" onClick="toevoegen_verwijderen(1);" /> verwijderen / toevoegen </div>
...
<div id="message"></div>
</body>
</html>
';
break;
case 'toevoegen_verwijderen':
$leerling_id = $_POST['leerling_id'];
$product_id = $_POST['product_id'];
$checked = $_POST['checked']; // = 1 of 0
switch ($checked)
{
// in db steken
case 1:
// INSERT ...
echo 'INSERT INTO ...'; // puur als voorbeeld, om te tonen dat er iets gebeurt
break;
case 0:
// DELETE ...
echo 'DELETE FROM ...';
break;
}
break;
}
?>
js.js
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
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
//////////////////////////////////////////////////////
//ajax
var http = null; // global
function createHTTPHandler()
{
httphandler = false;
// branch for native XMLHttpRequest object
if(window.XMLHttpRequest)
{
try
{
httphandler = new XMLHttpRequest();
} catch(e)
{
httphandler = false;
}
// branch for IE/Windows ActiveX version
}
else if(window.ActiveXObject)
{
try
{
httphandler = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e)
{
try
{
httphandler = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e)
{
httphandler = false;
}
}
}
return httphandler;
}
/////////////////////////////////////////////////////////////////////////////
// gebruik van Ajax
function handleHttpResponse_toevoegen_verwijderen()
{
if(http.readyState == 4)
{
// eventueel hier nog iets doen, zoals een message echo'en of zo
document.getElementById('message').innerHTML = http.responseText;
}
}
function toevoegen_verwijderen(index)
{
http = createHTTPHandler();
var leerling_id = document.getElementById('leerling_id[' + index + ']').value;
var product_id = document.getElementById('product_id[' + index + ']').value;
var checked = ( document.getElementById('order[' + index + ']').checked == true ? 1 : 0 );
var passData = 'leerling_id='+escape(leerling_id) + '&product_id='+escape(product_id) + '&checked='+escape(checked);
http.open("POST", "index.php?pagina=toevoegen_verwijderen", true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = handleHttpResponse_toevoegen_verwijderen;
http.send( passData );
}
//ajax
var http = null; // global
function createHTTPHandler()
{
httphandler = false;
// branch for native XMLHttpRequest object
if(window.XMLHttpRequest)
{
try
{
httphandler = new XMLHttpRequest();
} catch(e)
{
httphandler = false;
}
// branch for IE/Windows ActiveX version
}
else if(window.ActiveXObject)
{
try
{
httphandler = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e)
{
try
{
httphandler = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e)
{
httphandler = false;
}
}
}
return httphandler;
}
/////////////////////////////////////////////////////////////////////////////
// gebruik van Ajax
function handleHttpResponse_toevoegen_verwijderen()
{
if(http.readyState == 4)
{
// eventueel hier nog iets doen, zoals een message echo'en of zo
document.getElementById('message').innerHTML = http.responseText;
}
}
function toevoegen_verwijderen(index)
{
http = createHTTPHandler();
var leerling_id = document.getElementById('leerling_id[' + index + ']').value;
var product_id = document.getElementById('product_id[' + index + ']').value;
var checked = ( document.getElementById('order[' + index + ']').checked == true ? 1 : 0 );
var passData = 'leerling_id='+escape(leerling_id) + '&product_id='+escape(product_id) + '&checked='+escape(checked);
http.open("POST", "index.php?pagina=toevoegen_verwijderen", true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = handleHttpResponse_toevoegen_verwijderen;
http.send( passData );
}
EDIT: code wat aangepast. Bug uit gehaald
Gewijzigd op 01/01/1970 01:00:00 door Emmanuel Delay