flexigrid pour tableau dynamique

**maxredphenix** · 10/04/2012, 21h29

Bonsoir,

Je suis débutant en javascript et php. J'ai quelques petit soucis avec flexigrid : http://www.flexigrid.info/ pour afficher mon tableau dynamique, j'ai tester plusieurs trucs mais ...rien. Voici mes codes:
Le fichier javascript "tab_appel.js" pour afficher mon tableau

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
49
50
51
52
53
54
$(function() {
	$(".tab_appel").flexigrid({
	url:  'gest_appels_tableau.php',
	dataType: 'json',
 
	colModel : [
		{display: 'Numéro', name : 'id_appel', width : 40, sortable : true, align: 'left'},
		{display: 'Numéro', name : 'num_appelant', width : 100, sortable : true, align: 'left'},
		{display: 'Nom', name : 'nom_demandeur', width : 100, sortable : true, align: 'left'},
		{display: 'Service', name : 'service', width : 100, sortable : true, align: 'left'}
	],
 
	buttons : [
		{name: 'Ajouter', bclass: 'add', onpress : doCommand},
		{name: 'Supprimer', bclass: 'delete', onpress : doCommand},
		{separator: true}
	],
 
	searchitems : [
		{display: 'ID', name : 'id'},
		{display: 'Site', name : 'site', isdefault: true},
		{display: 'Type', name : 'type'}
	],
 
	sortname: "id",
	sortorder: "asc",
	usepager: true,
	title: "Liste des Appels",
	useRp: true,
	rp: 10,
	showTableToggleBtn: false,
	resizable: false,
	width: 800,
	height: 300,
	singleSelect: true
	});
});
 
function doCommand(com, grid) {
	if (com == 'Ajouter') {
		$('.trSelected', grid).each(function() {
			var id = $(this).attr('id');
			id = id.substring(id.lastIndexOf('row')+3);
			alert("Ajouter row " + id);
			});
	} 
	else if (com == 'Delete') {
		$('.trSelected', grid).each(function() {
			var id = $(this).attr('id');
			id = id.substring(id.lastIndexOf('row')+3);
			alert("Delete row " + id);
			});
		}
}

Le fichier php dans lequel je souhaite afficher mon tableau:

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
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
<!DOCTYPE html>
<?php
			// Connect to MySQL database
			mysql_connect('localhost', 'root', '');
			mysql_select_db('gestbdd');
			$page = 1; // La Page Actuelle
			$sortname = 'id_appel'; // Trier la colonne par ID
			$sortorder = 'asc'; // Trier la colonne
			$qtype = ''; // Rechercher la colonne
			$query = ''; // Rechercher la chaine
			// -----------------Commandes Identiques pour tous les tableaux, ne pas toucher -----------------------------
			// Obtention des données publiées
			if (isset ($ _POST ['page'])) {
			$ Page = mysql_real_escape_string ($ _POST ['page']);
			}
			if (isset ($ _POST ['sortName'])) {
			$ SortName = mysql_real_escape_string ($ _POST ['sortName']);
			}
			if (isset ($ _POST ['ordre de tri'])) {
			$ Sortorder = mysql_real_escape_string ($ _POST ['ordre de tri']);
			}
			if (isset ($ _POST ['qtype'])) {
			$ Qtype = mysql_real_escape_string ($ _POST ['qtype']);
			}
			if (isset ($ _POST ['query'])) {
			$ Query = mysql_real_escape_string ($ _POST ['query']);
			}
			if (isset ($ _POST ['rp'])) {
			$ Rp = mysql_real_escape_string ($ _POST ['rp']);
			}
			// Configuration pour le trie et la recherche des données SQL publiées
			$sortSql = "order by $sortname $sortorder";
			$searchSql = ($qtype != '' && $query != '') ? "where $qtype = '$query'" : '';
			// ---------Fin commandes Identiques-------------------------------------------------------------------------
			// Récupération du nombre de total d'enregistrements
			$sql = "select count(*)
			from appels
			$searchSql";
			$result = mysql_query($sql);
			$row = mysql_fetch_array($result);
			$total = $row[0];
			// Configuration de la pagination des données SQL
			$pageStart = ($page-1)*$rp;
			$limitSql = "limit $pageStart, $rp";
			// Retour des données JSON
			$data = array();
			$data['page'] = $page;
			$data['total'] = $total;
			$data['rows'] = array();
			$sql = "select id_appel, num_appelant, date_appel, nom_demandeur, services from appels
			$searchSql
			$sortSql
			$limitSql";
			$results = mysql_query($sql);
			while ($row = mysql_fetch_assoc($results))
			{
				$data['rows'][] = array('id' => $row['id'],'cell' => array($row['id_appel'], $row['num_appelant'], $row['nom_demandeur'], $row['service']));
			}
			echo json_encode($data);
?>
 
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- Titre -->
		<title>Gestion des Appels</title>
		<!-- Appel du css pour la page html + Menu -->
		<link href="../css/template_formulaires.css" rel="stylesheet" type="text/css" />
		<!-- Appel du css pour le tableau eyedatagrid -->
		<link href="../css/flexigrid.css" rel="stylesheet" type="text/css" />
		<!-- Appel des divers scripts -->
		<script type="text/javascript" src="../javascript/menu.js"></script> <!-- Fichier javascript pour le changement de couleur du texte du MENU -->
		<script type="text/javascript" src="../javascript/flexigrid.js"></script> <!-- Script d'affichage de tableau -->
		<script type="text/javascript" src="../javascript/tab_appel.js"></script> <!-- Script d'affichage de tableau -->
	</head>
 
	<body>
		<table id="tab_appel"></table>
	</body>
</html>

Voici l'appercu de la table appels:
http://www.developpez.net/forums/att...1&d=1334086151

Merci de votre aide

Maxredphenix

**Bovino** · 11/04/2012, 07h52

J'ai quelques petit soucis

C'est certainement pas ça qui va nous permettre de t'aider...

Sois plus explicite sur ce qui ne va pas : ce que tu souhaiterais faire, ce que tu obtiens, ce que te dis la console d'erreur (Firebug par exemple), bref, donne des informations !

**maxredphenix** · 12/04/2012, 21h15

Bonsoir,

Merci pour ta réponse. Je suis désolé c'est vrai que j'aurais du mettre un screenshot de l'erreur que voici:

Ce qui correspond à cette ligne:

Code :

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

1
2
// Obtention des données publiées
			if (isset ($ _POST ['page'])) {

Encore merci

maxrephenix

**Bovino** · 13/04/2012, 08h18

Tu ne remarques pas que tu as mis un espace entre $ et _POST ?

**maxredphenix** · 13/04/2012, 18h00

Merci pour réponse,

J'avais même pas fait gaffe à l'espace, le code de base je l'ai repris sur un tuto (qui devait pas fonctionner du coup

)

Par contre j'ai maintenant une erreur en ligne 14 alors que je viens de supprimer tous les espaces:

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
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
<!DOCTYPE html>
<?php
			// Connect to MySQL database
			mysql_connect('localhost', 'root', '');
			mysql_select_db('gestspie');
			$page = 1; // La Page Actuelle
			$sortname = 'id_appel'; // Trier la colonne par ID
			$sortorder = 'asc'; // Trier la colonne
			$qtype = ''; // Rechercher la colonne
			$query = ''; // Rechercher la chaine
			// -----------------Commandes Identiques pour tous les tableaux, ne pas toucher -----------------------------
			// Obtention des données publiées
			if (isset ($_POST ['page'])) {
			$ Page = mysql_real_escape_string ($_POST ['page']);
			}
			if (isset ($_POST ['sortName'])) {
			$ SortName = mysql_real_escape_string ($_POST ['sortName']);
			}
			if (isset ($_POST ['ordre de tri'])) {
			$ Sortorder = mysql_real_escape_string ($_POST ['ordre de tri']);
			}
			if (isset ($_POST ['qtype'])) {
			$ Qtype = mysql_real_escape_string ($_POST ['qtype']);
			}
			if (isset ($_POST ['query'])) {
			$ Query = mysql_real_escape_string ($_POST ['query']);
			}
			if (isset ($_POST ['rp'])) {
			$ Rp = mysql_real_escape_string ($_POST ['rp']);
			}
			// Configuration pour le trie et la recherche des données SQL publiées
			$sortSql = "order by $sortname $sortorder";
			$searchSql = ($qtype != '' && $query != '') ? "where $qtype = '$query'" : '';
			// ---------Fin commandes Identiques-------------------------------------------------------------------------
			// Récupération du nombre de total d'enregistrements
			$sql = "select count(*)
			from appels
			$searchSql";
			$result = mysql_query($sql);
			$row = mysql_fetch_array($result);
			$total = $row[0];
			// Configuration de la pagination des données SQL
			$pageStart = ($page-1)*$rp;
			$limitSql = "limit $pageStart, $rp";
			// Retour des données JSON
			$data = array();
			$data['page'] = $page;
			$data['total'] = $total;
			$data['rows'] = array();
			$sql = "select id_appel, num_appelant, date_appel, nom_demandeur, services from appels
			$searchSql
			$sortSql
			$limitSql";
			$results = mysql_query($sql);
			while ($row = mysql_fetch_assoc($results))
			{
				$data['rows'][] = array('id' => $row['id'],'cell' => array($row['id_appel'], $row['num_appelant'], $row['nom_demandeur'], $row['service']));
			}
			echo json_encode($data);
?>
 
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- Titre -->
		<title>Gestion des Appels</title>
		<!-- Appel du css pour la page html + Menu -->
		<link href="../css/template_formulaires.css" rel="stylesheet" type="text/css" />
		<!-- Appel du css pour le tableau eyedatagrid -->
		<link href="../css/flexigrid.css" rel="stylesheet" type="text/css" />
		<!-- Appel des divers scripts -->
		<script type="text/javascript" src="../javascript/menu.js"></script> <!-- Fichier javascript pour le changement de couleur du texte du MENU -->
		<script type="text/javascript" src="../javascript/flexigrid.js"></script> <!-- Script d'affichage de tableau -->
		<script type="text/javascript" src="../javascript/tab_appel.js"></script> <!-- Script d'affichage de tableau -->
	</head>
 
	<body>
		<table id="tab_appel"></table>
	</body>
</html>

Erreur:
Parse error: syntax error, unexpected T_STRING, expecting T_VARIABLE or '$' in C:\wamp\www\Monsite\php\gest_appels_tableau.php on line 14

**maxredphenix** · 13/04/2012, 20h58

En regardant sur le site de flexigrid j'ai réussi à enlever ces erreurs:
http://code.google.com/p/flexigrid/w...dDocumentation

Par contre de nouvelles erreurs apparaissent mais elles viennent de l’intérieur de fichiers de flexigrid:

Et voila donc le code qui donne tout cela:

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
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
<!DOCTYPE html>
<?php
			// Connect to MySQL database
			mysql_connect('localhost', 'root', '');
			mysql_select_db('gestspie');
			$page = 1; // La Page Actuelle
			$sortname = 'id_appel'; // Trier la colonne par ID
			$sortorder = 'asc'; // Trier la colonne
			$qtype = ''; // Rechercher la colonne
			$query = ''; // Rechercher la chaine
			// -----------------Commandes Identiques pour tous les tableaux, ne pas toucher -----------------------------
			// Obtention des données publiées
			if (isset($_POST['page'])) {
				$page = mysql_real_escape_string($_POST['page']);
			}
			if (isset($_POST['sortname'])) {
				$sortname = mysql_real_escape_string($_POST['sortname']);
			}
			if (isset($_POST['sortorder'])) {
				$sortorder = mysql_real_escape_string($_POST['sortorder']);
			}
			if (isset($_POST['qtype'])) {
				$qtype = mysql_real_escape_string($_POST['qtype']);
			}
			if (isset($_POST['query'])) {
				$query = mysql_real_escape_string($_POST['query']);
			}
			if (isset($_POST['rp'])) {
				$rp = mysql_real_escape_string($_POST['rp']);
			}
			// Configuration pour le trie et la recherche des données SQL publiées
			$sortSql = "order by $sortname $sortorder";
			$searchSql = ($qtype != '' && $query != '') ? "where $qtype = '$query'" : '';
			// ---------Fin commandes Identiques-------------------------------------------------------------------------
			// Récupération du nombre de total d'enregistrements
			$sql = "select count(*)
			from appels
			$searchSql";
			$result = mysql_query($sql);
			$row = mysql_fetch_array($result);
			$total = $row[0];
			// Configuration de la pagination des données SQL
			$pageStart = ($page-1)*$rp;
			$limitSql = "limit $pageStart, $rp";
			// Retour des données JSON
			$data = array();
			$data['page'] = $page;
			$data['total'] = $total;
			$data['rows'] = array();
			$sql = "select id_appel, num_appelant, date_appel, nom_demandeur, services from appels
			$searchSql
			$sortSql
			$limitSql";
			$results = mysql_query($sql);
			while ($row = mysql_fetch_assoc($results))
			{
				$data['rows'][] = array('id' => $row['id'],'cell' => array($row['id_appel'], $row['num_appelant'], $row['nom_demandeur'], $row['service']));
			}
			echo json_encode($data);
?>
 
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- Titre -->
		<title>Gestion des Appels</title>
		<!-- Appel du css pour la page html + Menu -->
		<link href="../css/template_formulaires.css" rel="stylesheet" type="text/css" />
		<!-- Appel du css pour le tableau eyedatagrid -->
		<link href="../css/flexigrid.css" rel="stylesheet" type="text/css" />
		<!-- Appel des divers scripts -->
		<script type="text/javascript" src="../javascript/menu.js"></script> <!-- Fichier javascript pour le changement de couleur du texte du MENU -->
		<script type="text/javascript" src="../javascript/jquery-1.7.1.min.js"></script> <!-- Script JQUERY minifiée--
		<script type="text/javascript" src="../javascript/flexigrid.js"></script> <!-- Script d'affichage de tableau -->
		<script type="text/javascript" src="../javascript/tab_appel.js"></script> <!-- Script d'affichage de tableau -->
	</head>
 
	<body>
		<table id="tab_appel"></table>
	</body>
</html>

La je vois pas pourquoi j'ai ces erreurs

**Bovino** · 14/04/2012, 10h52

je viens de supprimer tous les espaces

Euh... t'es sûr ?

Code :

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

$ Page = mysql_real_escape_string ($_POST ['page']);

**maxredphenix** · 14/04/2012, 14h22

Je comprends pas d'ou vient ta citation? Si c'est bien la ligne 14 j'ai plus d'espace et je l'ai plus en erreur dans chrome:

Code :

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

1
2
if (isset($_POST['page'])) {
				$page = mysql_real_escape_string($_POST['page']);

Par contre l'erreur vient à partir de la ligne 43:

Code :

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

1
2
3
// Configuration de la pagination des données SQL
			$pageStart = ($page-1)*$rp;
			$limitSql = "limit $pageStart, $rp";

et la ligne suivante:

Code :

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

while ($row = mysql_fetch_assoc($results))

merci

**maxredphenix** · 14/04/2012, 20h30

Ce qui est bizarre c'est que le wiki de flexigrid à exactement les mêmes lignes de codes:

http://code.google.com/p/flexigrid/w...dDocumentation

**maxredphenix** · 18/04/2012, 07h07

J'arrive toujours pas à voir d'ou vient l'erreur malgré plusieurs heures sur le wiki.

Personne ne saurait d'ou ca vient????

Merci

**SpaceFrog** · 18/04/2012, 08h43

d'ou ça vient ?
d'un plugin pourri ??

Je n'ai eu aucun souci de ce type avec dataTable ...

**maxredphenix** · 18/04/2012, 21h32

Je vais regarder ton plugin c'est vrai qu'il à l'air sympa

**maxredphenix** · 21/04/2012, 23h35

Je tente de configurer datatable mais je rencontre quelques difficultés.

En effet j'ai bien les champs de mon tableau qui apparaissent pas c'est comme si j'avais pas de css alors que le navigateur le lance bien:

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
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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<!DOCTYPE html>
<?php
	$db = mysql_connect('localhost', 'root', '');
	mysql_select_db('gestspie', $db);
	$sql = 'SELECT * FROM appels ORDER BY id';
	$req = mysql_query($sql) or die (mysql_error());
?>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- Titre -->
		<title>Gestion des Appels</title>
 
		<!-- Appel des fichiers CSS-->
		<link href="../css/template_formulaires.css" rel="stylesheet" type="text/css"/> <!-- Appel du css pour la page html + Menu -->
		<link href="../css/datatable_style.css" rel="stylesheet" type="text/css" /><!-- Appel du css pour la mise en forme du tableau -->
		<link href="../css/datatable_table_jui.css" rel="stylesheet" type="text/css" /><!-- Appel du css pour la mise en forme du tableau -->
		<link type="text/css" rel="stylesheet" href="../css/jquery-ui-1.8.18.custom.css"/><!-- Appel du css pour JQUERY -->
 
		<!-- Appel des divers scripts -->
		<script type="text/javascript" src="../javascript/menu.js"></script> <!-- Fichier javascript pour le changement de couleur du texte du MENU -->
		<script type="text/javascript" src="../javascript/jquery-1.7.1.min.js"></script> <!-- Script JQUERY minifiée-->
		<script type="text/javascript" src="../javascript/jquery-1.8.18.js"></script> <!-- Script JQUERY-->
		<script type="text/javascript" src="../javascript/jquery.dataTables.js"></script> <!-- Plugin Datatable -->
		<script type="text/javascript" src="../javascript/jquery.datatables.tabletools.js"></script> <!-- Plugin Datatable pour l'exportation vers différents formats -->
		<script type="text/javascript" src="../javascript/jquery.datatables.zeroclipboard.js"></script> <!-- Datatable: Script utilisant un fichier Flash pour effectuer la copie vers le presse-papier -->
 
		<!-- Configuration de base du tableau Datatable -->
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				$('#menuTable').dataTable({
					"bJQueryUI": true,
					"sPaginationType": "full_numbers",
					"sDom": '<"clear"><"H"Tflr>t<"F"ip>',
					"oTableTools": { "sSwfPath": "datatable_swf/copy_cvs_xls_pdf.swf"},
					"sAjaxSource": "datatable_server_processing.php"
					"oLanguage": { "sUrl": "datatable_fr.txt" }
				});
			});
		</script>
	</head>
	<body>
		<!-- En Tête -->
			<!-- Banniere avec logo -->
			<div id="header" class="banniere">
				<div id="logo"><a href="" target="_blank" title="logo" alt="Spie"></a></div>
				<div id="titre"><a>Gestion des Appels</a></div>
			</div>
 
		<!-- Menu -->
		<ul id="menu">
			<li>
                <a href="../index.php">Revenir au menu</a> <!-- Enregistrement de la page en cours après avoir rempli les champs du formulaire + Revenir au menu -->
			</li>     
			<li>
                <a href="#">Tout afficher</a> <!-- Affichage de toutes les fiches dans un tableau -->
			</li>
			<li>
                <a href="#">Graphiques</a> <!-- Affichage des différents graphiques possibles -->
                <ul>
                    <li>
                        <a href="#">Par Date</a>
                    </li>
                    <li>
                        <a href="#">Par type d'Appel</a>
                    </li>
                </ul>
			</li>   
			<li>
                <a href="#">Imprimer</a> <!-- Impression de la page en cours-->
			</li>  		
		</ul>
 
		<!-- Affichage du tableau -->
		<div id="tableau_appels">
			<table cellpadding="0" cellspacing="0" border="0" class="display" id="menuTable">
			<!-- Menu de la table -->
			<thead>  
				<!-- Gestion du nom des colonnes -->
				<tr>         
					<th width="5%">N°</th>  
					<th width="7%">Date</th> 
					<th width="7%">Heure</th>  
					<th width="10%">Demandeur</th>           
					<th width="6%">Tel</th>
					<th width="5%">Bâtiment</th>  
					<th width="10%">Service</th>  
					<th width="10%">Média</th>
					<th width="10%">Type Inter</th>
					<th width="30%">Objet</th>     
				</tr>
			</thead>
			<!--Corps de la table : Affichage des données-->
			<tbody>  
				<tr>         
					<td colspan="5">Chargement des données du serveur</td>     
				</tr>
			</tbody> 
			<!-- Pied du tableau: on peut copier le contenu du thead si on souhaite afficher en haut et en bas le nom des colonnes -->
			<tfoot>  
				<tr>         
					<th colspan="5">&nbsp;</th>
				</tr>
			</tfoot>
			</table>
		</div>
	</body>
</html>

et la c'est les fichiers js et css que j'appelle:
http://dl.dropbox.com/u/31901874/datatable.rar

Je comprends pas parce que j'ai suivie exactement un tuto sur le net et ca fait 2 jours que je cherche pourquoi il y a que ça a l'écran:
http://dl.dropbox.com/u/31901874/prob%20database.jpg

Merci

**maxredphenix** · 22/04/2012, 22h32

J'ai tenter d'autres modification parce que je suis rendu compte qu'il y avait pas de récupération des données dans le tableau.

Voila le code actuel:

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
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
90
91
92
93
94
95
<!DOCTYPE html>
<?php
	$db = mysql_connect('localhost', 'root', '');
	mysql_select_db('gestspie', $db);
	$sql = 'SELECT * FROM appels ORDER BY id';
	$req = mysql_query($sql) or die (mysql_error());
?>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- Titre -->
		<title>Gestion des Appels</title>
 
		<!-- Appel des fichiers CSS-->
		<link href="../css/template_formulaires.css" rel="stylesheet" type="text/css"/> <!-- Appel du css pour la page html + Menu -->
		<link href="../css/datatable_style.css" rel="stylesheet" type="text/css" /><!-- Appel du css pour la mise en forme du tableau -->
		<link href="../css/datatable_table_jui.css" rel="stylesheet" type="text/css" /><!-- Appel du css pour la mise en forme du tableau -->
		<link type="text/css" rel="stylesheet" href="../css/jquery-ui-1.8.19.custom.css"/><!-- Appel du css pour JQUERY -->
		<link href="../css/fenetre_modale.css" rel="stylesheet" type="text/css" /><!-- Appel du css pour la fenêtre modale -->
 
		<!-- Appel des divers scripts -->
		<script type="text/javascript" src="../javascript/menu.js"></script> <!-- Fichier javascript pour le changement de couleur du texte du MENU -->
		<script type="text/javascript" src="../javascript/jquery-1.7.2.min.js"></script> <!-- Script JQUERY minifiée-->
		<script type="text/javascript" src="../javascript/jquery-1.8.19.js"></script> <!-- Script JQUERY-->
		<script type="text/javascript" src="../javascript/fenetre_modale.js"></script> <!-- Script ouverture de fenêtre modale-->
		<script type="text/javascript" src="../javascript/jquery.dataTables.js"></script> <!-- Plugin Datatable -->
		<script type="text/javascript" src="../javascript/jquery.datatables.tabletools.js"></script> <!-- Plugin Datatable pour l'exportation vers différents formats -->
		<script type="text/javascript" src="../javascript/jquery.datatables.zeroclipboard.js"></script> <!-- Datatable: Script utilisant un fichier Flash pour effectuer la copie vers le presse-papier -->
 
		<!-- Configuration de base du tableau Datatable -->
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				$('#datatable').dataTable({
					"bProcessing": true,
					"bServerSide": true,
					"bJQueryUI": true,
					"sPaginationType": "full_numbers",
					"sDom": '<"clear"><"H"Tflr>t<"F"ip>',
					"oTableTools": { "sSwfPath": "datatable_swf/copy_cvs_xls_pdf.swf"},
					"sAjaxSource": "get_datatable.php"
					"oLanguage": { "sUrl": "datatable_fr.txt" }
				});
			});
		</script>
	</head>
	<body>
		<!-- En Tête -->
			<!-- Banniere avec logo -->
			<div id="header" class="banniere">
				<div id="logo"><a href="#?w=700" rel="popup_name" class="poplight" title="logo" alt="logo"><img src="../images/logo.gif" /></a></div>
				<div id="titre"><a>Gestion des Appels</a></div>
			</div>
 
		<!-- Menu -->
		<ul id="menu">
			<li><a href="../index.php">Revenir au menu</a></li> <!-- Enregistrement de la page en cours après avoir rempli les champs du formulaire + Revenir au menu -->
			<li><a href="#">Graphiques</a></li><!-- Affichage des différents graphiques possibles -->		
		</ul>
		<form>
			<!-- Affichage du tableau -->
			<div id="tableau_appels">
				<table cellpadding="0" cellspacing="0" border="0" class="display" id="menuTable">
				<!-- Menu de la table -->
				<thead>  
					<!-- Gestion du nom des colonnes -->
					<tr>         
						<th width="5%">N°</th>  
						<th width="7%">Date</th> 
						<th width="7%">Heure</th>  
						<th width="10%">Demandeur</th>           
						<th width="6%">Tel</th>
						<th width="5%">Bâtiment</th>  
						<th width="10%">Service</th>  
						<th width="10%">Média</th>
						<th width="10%">Type Inter</th>
						<th width="30%">Objet</th>     
					</tr>
				</thead>
				<!--Corps de la table : Affichage des données-->
				<tbody>  
					<tr>         
						<td colspan="10">Chargement des données...</td>     
					</tr>
				</tbody> 
				<!-- Pied du tableau: on peut copier le contenu du thead si on souhaite afficher en haut et en bas le nom des colonnes -->
				<tfoot>  
					<tr>         
						<th colspan="10">&nbsp;</th>
					</tr>
				</tfoot>
				</table>
			</div>
		</form>
	</body>
</html>

la page me servant à récupérer les données:

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
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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<?php
  /* MySQL connection */
	$gaSql['user']       = "admin";
	$gaSql['password']   = "";
	$gaSql['db']         = "gestspie";
	$gaSql['server']     = "localhost";
	$gaSql['type']       = "mysql";
 
	$gaSql['link'] =  mysql_pconnect( $gaSql['server'], $gaSql['user'], $gaSql['password']  ) or
		die( 'Could not open connection to server' );
 
	mysql_select_db( $gaSql['db'], $gaSql['link'] ) or
		die( 'Could not select database '. $gaSql['db'] );
 
	/* Paging */
	$sLimit = "";
	if ( isset( $_GET['iDisplayStart'] ) )
	{
		$sLimit = "LIMIT ".mysql_real_escape_string( $_GET['iDisplayStart'] ).", ".
			mysql_real_escape_string( $_GET['iDisplayLength'] );
	}
 
	/* Ordering */
	if ( isset( $_GET['iSortCol_0'] ) )
	{
		$sOrder = "ORDER BY  ";
		for ( $i=0 ; $i<mysql_real_escape_string( $_GET['iSortingCols'] ) ; $i++ )
		{
			$sOrder .= fnColumnToField(mysql_real_escape_string( $_GET['iSortCol_'.$i] ))."
			 	".mysql_real_escape_string( $_GET['sSortDir_'.$i] ) .", ";
		}
		$sOrder = substr_replace( $sOrder, "", -2 );
	}
 
	/* Filtrage - Remplace le filtrage côté client, peut donc être long si la base de données est importante */
	$sWhere = "";
	if ( $_GET['sSearch'] != "" )
	{
		$sWhere = "WHERE num_appelant = '".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "date_appel = '".mysql_real_escape_string( $_GET['sSearch'] )."' OR ".
		                "heure_appel = '".mysql_real_escape_string( $_GET['sSearch'] )."'";
						"media = '".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "nom_demandeur_appel = '".mysql_real_escape_string( $_GET['sSearch'] )."' OR ".
		                "batiment = '".mysql_real_escape_string( $_GET['sSearch'] )."'";
						"service = '".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ".
		                "type_inter = '".mysql_real_escape_string( $_GET['sSearch'] )."' OR ".
		                "objet_appel = '".mysql_real_escape_string( $_GET['sSearch'] )."'";
	}
 
	$sQuery = "SELECT id, num_appelant, date_appel, heure_appel, media, nom_demandeur, batiment, service, type_inter, objet_appel FROM appels $sWhere $sOrder $sLimit";
	$rResult = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
 
	$sQuery = "SELECT FOUND_ROWS()";
 
	$rResultFilterTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
	$aResultFilterTotal = mysql_fetch_array($rResultFilterTotal);
	$iFilteredTotal = $aResultFilterTotal[0];
 
	$sQuery = "SELECT COUNT(id)	FROM appels";
	$rResultTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
	$aResultTotal = mysql_fetch_array($rResultTotal);
	$iTotal = $aResultTotal[0];
 
	$sOutput = '{';
	$sOutput .= '"sEcho": '.intval($_GET['sEcho']).', ';
	$sOutput .= '"iTotalRecords": '.$iTotal.', ';
	$sOutput .= '"iTotalDisplayRecords": '.$iFilteredTotal.', ';
	$sOutput .= '"aaData": [ ';
	while ( $aRow = mysql_fetch_array( $rResult ) )
	{
		$sOutput .= "[";
		$sOutput .= '"'.addslashes(date(H:i d/m/Y'', $aRow['date_appel'])).'",';
		$sOutput .= '"'.addslashes(date(H:i d/m/Y'', $aRow['heure_appel'])).'",';
		$sOutput .= '"'.addslashes($aRow['nom_demandeur']).'",';
		$sOutput .= '"'.addslashes($aRow['num_appelant']).'",';
		$sOutput .= '"'.addslashes($aRow['batiment']).'"';
		$sOutput .= '"'.addslashes($aRow['service']).'",';
		$sOutput .= '"'.addslashes($aRow['media']).'",';
		$sOutput .= '"'.addslashes($aRow['type_inter']).'"';
		$sOutput .= '"'.addslashes($aRow['objet_appel']).'"';
		$sOutput .= '"<a href="gest_appels_tableau.php?id=" '.$arow['id'].'="">Détails</a>"';
		$sOutput .= "],";
	}
	$sOutput = substr_replace( $sOutput, "", -1 );
	$sOutput .= '] }';
 
	echo $sOutput;
 
	function fnColumnToField( $i )
	{
		if ( $i == 0 )
			return "id";
		else if ( $i == 1 )
			return "date_appel";
		else if ( $i == 2 )
			return "heure_appel";
		else if ( $i == 3 )
			return "nom_demandeur";
		else if ( $i == 4 )
			return "num_appelant";
		else if ( $i == 5 )
			return "batiment";
		else if ( $i == 6 )
			return "service";
		else if ( $i == 7 )
			return "media";
		else if ( $i == 8 )
			return "type_inter";
		else if ( $i == 9 )
			return "objet_appel";
	}
?>

mais voila ce que ça donne:
Nom : apercu tableau.jpg
Affichages : 428
Taille : 33,9 Ko

est-ce que quelqu'un pourrait m'aider?

Merci d'avance

maxredphenix

**SpaceFrog** · 28/04/2012, 10h03

Si tu utilses fireefox, as tu un message d'erreur dans le console ?

Code :

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

1
2
		<script type="text/javascript" src="../javascript/jquery-1.7.2.min.js"></script> <!-- Script JQUERY minifiée-->
		<script type="text/javascript" src="../javascript/jquery-1.8.19.js"></script> <!-- Script JQUERY-->

Deux fois jquery ... ???

**maxredphenix** · 28/04/2012, 10h17

Merci pour ta réponse,

voila ce que me donne chrome

Pour jquery je sais pas, à chaque fois que j'ai regardé des tutos ils mettaient la version normale et la version minifié....

Sinon voici les fichiers php, ça sera plus simple à lire par rapport au forum:
http://dl.dropbox.com/u/31901874/ges...ls_tableau.php
http://dl.dropbox.com/u/31901874/get_datatable.php

Encore merci

**SpaceFrog** · 28/04/2012, 10h23

il manque déja une virgule dasn le json des paramètres

Code :

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

1
2
3
"oTableTools": { "sSwfPath": "datatable_swf/copy_cvs_xls_pdf.swf"},
					"sAjaxSource": "get_datatable.php",
					"oLanguage": { "sUrl": "datatable_fr.txt" }

**maxredphenix** · 28/04/2012, 10h30

C'est bon je viens de la rajouter, j'ai plus d'erreur reconnu par chorme mais j'ai toujours la même vue que ce que tu vois dans le screenshot que je t'ai fais précédement

**maxredphenix** · 28/04/2012, 10h35

AU faite pour jquery, je viens d'enlever la ligne d'appel de jquery 1.8 pour laisser la version minifié sur quelques pages de mon site et en effet j'ai pas d'erreur reconnu. C'est quoi le mieux, laisser la version normale ou la version minifié?

**SpaceFrog** · 28/04/2012, 10h36

regarde dans la console au niveau de la conversation post entre la page et le serveur ...
clique sur le post dans la console et regarde dans l'onglet reponse ...
Je pense au vu de tes précédents posts que tu as une erreur de syntaxe dans le php de traitement il doit manquer un ;

flexigrid pour tableau dynamique

jQuery

Discussions similaires

Partager

Partager