Versio

Verwijderen en toevoegen dmv checkbox

Webdesign & development » Algemene PHP scripting en meer » Verwijderen en toevoegen dmv checkbox

Overzicht Reageren

Jurgen assaasas

Jurgen assaasas

18/09/2008 07:25:00
Quote Anchor link
Ik heb wat data die in een PostgreSQL database wordt gezet, dit werkt perfect, ik werk met checkboxen die in een array wordt gezet en vervolgens dmv een loopje wordt alles in de database gezet. Eigenlijk wil ik een soort van Ajax request maken als ik een vakje aanvink dat deze automatisch wordt opgeslagen en als je hem weer uitvinkt dat hij weer wordt verwijderd. Maar eigenlijk heb ik geen flauw idee hoe ik dit aanpak.

Dit is mijn (relevante) stukje datamodel:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
orders
----------------------
leerling_id
product_id


Dit is dus een koppel tabel. Bij aanvinken moet de order verwijderd worden, bij afvinken moet hij worden verwijderd.
 
PHP hulp

PHP hulp

25/05/2012 17:41:09
Gesponsorde koppelingen:
BHosted Hosting al vanaf € 1,- per maand

Controleer nu gratis jouw domeinnaam:

  
 
Emmanuel Delay

Emmanuel Delay

18/09/2008 10:13:00
Quote Anchor link
Weet je hoe je met Ajax moet omgaan?
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?
 
Jurgen assaasas

Jurgen assaasas

18/09/2008 10:16:00
Quote Anchor link
Het SQL/PHP deel weet ik wel, maar hoe ga ik de ajax requests uitvoeren? Dat is eigenlijk mijn grootste vraag. Misschien heeft iemand een voorbeeldje.
 
Emmanuel Delay

Emmanuel Delay

18/09/2008 10:50:00
Quote Anchor link
Zie eens of je hier iets mee bent
index.php
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<?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;
  }
?>


js.js
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
//////////////////////////////////////////////////////
//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
 



Overzicht Reageren