Discussion :

[LuffyyffuL]

Bonjour,

Voici mon besoin :

Gérer via un tableau codé en AJAX, JavaScript, PHP, l'ajout de données en base, la modification et la suppression, cette partie fonctionne parfaitement.

N'ayant pas de grosse connaissance en programmation, j'ai essayé d'ajouter une function "filtre" pour afficher dans le tableau généré les données qui m'intéressent.


Voici le code que j'ai trouver sur le Net et qui marche pour les fonctions ADD, DELETE et UPDATE :


** index.php ** -> Pas grand chose, juste un tableau vide

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<table id='demoajax' cellspacing="0">
</table>

** DbManipulate.php **

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
85
86
87
88
89
<?php
 
include('db.php');
 
 if(isset($_REQUEST['actionfunction']) && $_REQUEST['actionfunction']!=''){
$actionfunction = $_REQUEST['actionfunction'];
 
   call_user_func($actionfunction,$_REQUEST,$con);
}
 
 
// Fonction Save DATA
 
function saveData($data,$con){
 
	$fname = $con->real_escape_string($data['fname']);
	$lname = $con->real_escape_string($data['lname']);
	$domain = $con->real_escape_string($data['domain']);
	$email = $con->real_escape_string($data['email']);
	$sql = "insert into ajaxtable(firstname,lastname,domain,email) values('$fname','$lname','$domain','$email')";
 
	if($con->query($sql)){
 
		showData($data,$con);
 
	} else {
 
		echo "error";
 
	}
 
}
 
 
// Fonction Show DATA
 
function showData($data,$con){
 
	$sql = "select * from ajaxtable order by id asc";
	$data = $con->query($sql);
	$str='<tr class="head"><td>Firstname</td><td>Lastname</td><td>Domain</td><td>Email</td><td></td></tr>';
 
 
	//if($data->num_rows>0) if (($firstname_tri) != "") {
	if($data->num_rows>0) if (($firstname_tri) == "") {
 
		while( $row = $data->fetch_array(MYSQLI_ASSOC)){
 
			$str.="<tr id='".$row['id']."'><td>".$row['firstname']."</td><td>".$row['lastname']."</td><td>".$row['domain']."</td><td>".$row['email']."</td><td><input type='button' class='ajaxedit' value='Edit'/> <input type='button' class='ajaxdelete' value='Delete'></td></tr>";
 
		}
 
	} else {
 
		$str .= "<td colspan='5'>No Data Available</td>";
 
	}
 
	echo $str;
 
}
 
 
 
function updateData($data,$con){
  $fname = $con->real_escape_string($data['fname']);
  $lname = $con->real_escape_string($data['lname']);
  $domain = $con->real_escape_string($data['domain']);
  $email = $con->real_escape_string($data['email']);
  $editid = $con->real_escape_string($data['editid']);
  $sql = "update ajaxtable set firstname='$fname',lastname='$lname',domain='$domain',email='$email' where id=$editid";
  if($con->query($sql)){
    showData($data,$con);
  }
  else{
   echo "error";
  }
  }
  function deleteData($data,$con){
    $delid = $con->real_escape_string($data['deleteid']); 
	$sql = "delete from ajaxtable where id=$delid";
	if($con->query($sql)){
	  showData($data,$con);
	}
	else{
	echo "error";
	}
  }
?>

Maintenant, le code que j'ai remixé avec une function "Filtre" trouvée sur le Net, ça ne doit pas être très beau :/

** index.php **

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunctionTri(){
 var ajaxRequest;  // The variable that makes Ajax possible!
 
 try{
   // Opera 8.0+, Firefox, Safari
   ajaxRequest = new XMLHttpRequest();
 }catch (e){
   // Internet Explorer Browsers
   try{
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
   }catch (e) {
      try{
         ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
      }catch (e){
         // Something went wrong
         alert("Your browser broke!");
         return false;
      }
   }
 }
 // Create a function that will receive data 
 // sent from the server and will update
 // div section in the same page.
 ajaxRequest.onreadystatechange = function(){
   if(ajaxRequest.readyState == 4){
      var ajaxDisplay = document.getElementById('ajaxDiv');
      ajaxDisplay.innerHTML = ajaxRequest.responseText;
   }
 }
 // Now get the value from user and pass it to
 // server script.
 var firstname_tri = document.getElementById('firstname_tri').value;
 var lastname_tri = document.getElementById('lastname_tri').value;
 var domain_tri = document.getElementById('domain_tri').value;
 var email_tri = document.getElementById('email_tri').value;
 
var queryString = "?firstname_tri=" + firstname_tri ;
	queryString += "&lastname_tri=" + lastname_tri + "&domain_tri=" + domain_tri + "&email_tri=" + email_tri ;
 
	//ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
	ajaxRequest.open("GET", "DbManipulate.php" + queryString, true);
 
	ajaxRequest.send(null); 
}
</script>

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<form name='forumulaire_filtres'>
	<div class="div_tbl_form_filtres_maitre">
		<div class="div_tbl_from_filtres_titre">
			<b>Filtres</b>
		</div>
		<div class="div_tbl_form_filtres_menu">
			<div class="div_tbl_form_filtres_menu_date"><b>firstname</b></div>
			<div class="div_tbl_form_filtres_menu_priorite"><b>lastname</b></div>
			<div class="div_tbl_form_filtres_menu_numdt"><b>domain</b></div>
			<div class="div_tbl_form_filtres_menu_application"><b>email</b></div>
		</div>
		<div class="div_tbl_form_filtres">
			<div class="div_tbl_form_filtres_date"><input type='text' id='firstname_tri' size="9" value="" maxlength="10"/></div>
			<div class="div_tbl_form_filtres_date"><input type='text' id='lastname_tri' size="9" value="" maxlength="10"/></div>
			<div class="div_tbl_form_filtres_numdt"><input type='text' id='domain_tri' size="11" value="" maxlength="11"/></div>
			<div class="div_tbl_form_filtres_numdt"><input type='text' id='email_tri' size="11" value="" maxlength="11"/></div>
		</div>
		<div class="div_tbl_form_valider"><input class="bouton_valider" type='button' onclick='ajaxFunctionTri()' value='Valider'/></div>
	</div>
</form> 
<div id='ajaxDiv'>Your result will display here</div>
<table id='demoajax' cellspacing="0">
</table>

** Dbmanipulate.php ** -> Ce code a été ajouté au début du fichier

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
85
86
function filtreDate ($data,$con) {
 
	$dbhost = "localhost";
	$dbuser = "userdemandes";
	$dbpass = "userdemandes";
	$dbname = "demandes";
 
 
	//Connect to MySQL Server
	mysql_connect($dbhost, $dbuser, $dbpass);
 
 
	//Select Database
	mysql_select_db($dbname) or die(mysql_error());
 
 
	// Retrieve data from Query String
	$firstname_tri = $_GET['firstname_tri'];
	$lastname_tri = $_GET['lastname_tri'];
	$domain_tri = $_GET['domain_tri'];
	$email_tri = $_GET['email_tri'];
 
 
	// Escape User Input to help prevent SQL Injection
	$firstname_tri = mysql_real_escape_string($firstname_tri);
	$lastname_tri = mysql_real_escape_string($lastname_tri);
	$domain_tri = mysql_real_escape_string($domain_tri);
	$email_tri = mysql_real_escape_string($email_tri);
 
 
 
	if (($firstname_tri) != "") {
 
		//build query
		$query = "SELECT * FROM ajaxtable WHERE firstname = '$firstname_tri'";
 
		if (($lastname_tri) != "")
		$sql .= " AND lastname = '$lastname_tri'";
 
		if (($domain_tri) != "")
		$sql .= " AND domain = '$domain_tri'";
 
		if (($email_tri) != "")
		$sql .= " AND email = '$email_tri'";
 
 
 
		//Execute query
		$qry_result = mysql_query($query) or die(mysql_error());
 
		//Build Result String
		$display_string = "<div class='div_tbl_filtres_maitre'>";
 
		$display_string .= "<div class='div_tbl_filtres_menu'>";
 
		$display_string .= "<div class='div_tbl_filtres_menu_date'><b>firstname</b></div>";
		$display_string .= "<div class='div_tbl_filtres_menu_priorite'><b>lastname</b></div>";
		$display_string .= "<div class='div_tbl_filtres_menu_numdt'><b>domain</b></div>";
		$display_string .= "<div class='div_tbl_filtres_menu_application'><b>email</b></div>";
		$display_string .= "</div>";
 
 
		// Insert a new row in the table for each person returned
		while($row = mysql_fetch_array($qry_result)){
 
			//$display_string .= "<div class='div_tbl_filtres_view'>";
 
			if ( $row[statut]=="OK" ) { $display_string .= "<div class='div_tbl_filtres_view_ok'>"; } else { $display_string .= "<div class='div_tbl_filtres_view_ko'>"; }
 
			$display_string .= "<div class='div_tbl_filtres_date'>$row[firstname]</div>";
			$display_string .= "<div class='div_tbl_filtres_priorite'>$row[lastname]</div>";
			$display_string .= "<div class='div_tbl_filtres_numdt'>$row[domain]</div>";
			$display_string .= "<div class='div_tbl_filtres_application'>$row[email]</div>";
 
			$display_string .= "</div>";
		}
 
		echo "Query: " . $query . "<br />";
 
		$display_string .= "</div>";
 
		echo $display_string;
 
	}
 
}

** ajax-exemple.php **

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<?php
 
$dbhost = "localhost";
$dbuser = "userdemandes";
$dbpass = "userdemandes";
$dbname = "demandes";
 
//Connect to MySQL Server
mysql_connect($dbhost, $dbuser, $dbpass);
 
//Select Database
mysql_select_db($dbname) or die(mysql_error());
 
// Retrieve data from Query String
$firstname_tri = $_GET['firstname_tri'];
$lastname_tri = $_GET['lastname_tri'];
$domain_tri = $_GET['domain_tri'];
$email_tri = $_GET['email_tri'];
 
 
// Escape User Input to help prevent SQL Injection
$firstname_tri = mysql_real_escape_string($firstname_tri);
$lastname_tri = mysql_real_escape_string($lastname_tri);
$domain_tri = mysql_real_escape_string($domain_tri);
$email_tri = mysql_real_escape_string($email_tri);
 
 
//build query
$query = "SELECT * FROM ajaxtable WHERE firstname = '$firstname_tri'";
 
if (($lastname_tri) != "")
$sql .= " AND lastname = '$lastname_tri'";
 
if (($domain_tri) != "")
$sql .= " AND domain = '$domain_tri'";
 
if (($email_tri) != "")
$sql .= " AND email = '$email_tri'";
 
 
 
//Execute query
$qry_result = mysql_query($query) or die(mysql_error());
 
//Build Result String
$display_string = "<div class='div_tbl_filtres_maitre'>";
 
$display_string .= "<div class='div_tbl_filtres_menu'>";
 
$display_string .= "<div class='div_tbl_filtres_menu_date'><b>firstname</b></div>";
$display_string .= "<div class='div_tbl_filtres_menu_priorite'><b>lastname</b></div>";
$display_string .= "<div class='div_tbl_filtres_menu_numdt'><b>domain</b></div>";
$display_string .= "<div class='div_tbl_filtres_menu_application'><b>email</b></div>";
$display_string .= "</div>";
 
 
// Insert a new row in the table for each person returned
while($row = mysql_fetch_array($qry_result)){
 
	//$display_string .= "<div class='div_tbl_filtres_view'>";
 
	if ( $row[statut]=="OK" ) { $display_string .= "<div class='div_tbl_filtres_view_ok'>"; } else { $display_string .= "<div class='div_tbl_filtres_view_ko'>"; }
 
	$display_string .= "<div class='div_tbl_filtres_date'>$row[firstname]</div>";
	$display_string .= "<div class='div_tbl_filtres_priorite'>$row[lastname]</div>";
	$display_string .= "<div class='div_tbl_filtres_numdt'>$row[domain]</div>";
	$display_string .= "<div class='div_tbl_filtres_application'>$row[email]</div>";
 
	$display_string .= "</div>";
}
 
echo "Query: " . $query . "<br />";
 
$display_string .= "</div>";
 
echo $display_string;
 
?>

En gros le code avec l'ajout des "Filtres" fonctionne à peut prêt bien, sauf que si je rajoute une données et que je refiltre, il ne trouvera pas les nouvelles données ajoutées en base.

De plus, je ne souhaite pas avoir 2 tableaux, un pour les données à afficher filtrées et un pour les fonctions ADD, UPDATE, DELETE.

J'ai essayé d'autres choses avec le code, mais c'est plus de la cuisine qu'autre chose.

C'est pourquoi je vous demande de l'aide afin de crééer une fonction "Filtre" qui reprend la meme logique et structure que les autres, et qui utilise le tableau généré de base comme pour la function "showData".

Je vous remercie par avance

[Darkauron]

Bonjour,

Pour la gestion des tableaux, j'utilise DataTable. C'est une bibliothèque de gestion de tableau avec beaucoup de fonctionnalité et selon moi, assez simple à prendre en main. Ça pourrait répondre à ton besoin.

Je te conseille de regarder de ce côté si tu en as la possibilité.

Darkauron

[LuffyyffuL]

Bonjour,

DataTable répondrait à mes besoins, est-ce-que c'est gratuit

Merci

[Darkauron]

Oui, c'est gratuit, mais tu peux payer si tu veux supporter le projet. Information à retrouver sur le site de Datatable.

[LuffyyffuL]

Merci pour l'info, j'ai téléchargé les sources, il y en a beaucoup, je vais chercher un tuto sur le net.

[LuffyyffuL]

Je reste quand meme à l'écoute pour l'écriture d'une fonction "Filtre" qui reprend la meme logique que le code mit ci-dessus