Tableaux dynamiques avec flexigrid

[geemo]

Bonjour,

je développe un petit tableau dynamiques pour:
Afficher une liste de données,
Ajouter des données
Effectuer une recherche parmi les données etc ...

J'ai télécharger flexigrid ici :http://www.flexigrid.info/
mais j'arrive pas à récupérer les infos de la base via mon php ( un post ajax).

Merci !

[SpaceFrog]

je vois pas ton code ...

[FrankOVD]

Je ne sais pas où tu en est rendu mais je te propose d'essayer jqGrid, leur documentation semble plus complète.

[geemo]

Bonjour,

j'arrive à récupérer les infos de la base via mon php.
mais j'arrive pas à ajouter ni à modifier les données directement à partir de mon tableau.

le fichier pour le tableau

Code :

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
<table class="flexme3" style="display: none"></table>
<script type="text/javascript">
		$(function() {
			$(".flexme3").flexigrid({
				url:  'media/ajax/post-xml.php',
				dataType: 'json',
 
				colModel : [
					{display: 'ID', name : 'id', width : 40, sortable : true, align: 'left'},
					{display: 'Nom', name : 'nom', width : 100, sortable : true, align: 'left'},
					{display: 'Prenom', name : 'prenom', width : 100, sortable : true, align: 'left'},
					{display: 'Langue', name : 'langue', width : 100, sortable : true, align: 'left'}
 
				],
 
				buttons : [
					{name: 'Ajouter', bclass: 'add', onpress : doCommand},
					{name: 'Delete', 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: "Rémuneration",
				useRp: true,
				rp: 10,
				showTableToggleBtn: false,
				resizable: false,
				width: 800,
				height: 200,
				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);
				});
			}
		}
 
	</script>

le fichier php

Code :

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
 
<?php
// Connect to MySQL database
mysql_connect('localhost', 'root', '');
mysql_select_db('mabase');
$page = 1; // The current page
$sortname = 'id'; // Sort column
$sortorder = 'asc'; // Sort order
$qtype = ''; // Search column
$query = ''; // Search string
// Get posted data
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']);
}
// Setup sort and search SQL using posted data
$sortSql = "order by $sortname $sortorder";
$searchSql = ($qtype != '' && $query != '') ? "where $qtype = '$query'" : '';
// Get total count of records
$sql = "select count(*)
from compte
$searchSql";
$result = mysql_query($sql);
$row = mysql_fetch_array($result);
$total = $row[0];
// Setup paging SQL
$pageStart = ($page-1)*$rp;
$limitSql = "limit $pageStart, $rp";
// Return JSON data
$data = array();
$data['page'] = $page;
$data['total'] = $total;
$data['rows'] = array();
$sql = "select id, langue, nom, prenom
from compte
$searchSql
$sortSql
$limitSql";
$results = mysql_query($sql);
while ($row = mysql_fetch_assoc($results)) {
   $data['rows'][] = array(
   'id' => $row['id'],
   'cell' => array($row['id'], $row['langue'], $row['nom'], $row['prenom'])
);
}
echo json_encode($data);
?>

le reste du code ( les js et les css ) se trouve dans un zip disponible sur ce site http://www.flexigrid.info/

Merci !

Envoyé par SpaceFrog

je vois pas ton code ...

[okoweb]

Envoyé par FrankOVD

Je ne sais pas où tu en est rendu mais je te propose d'essayer jqGrid, leur documentation semble plus complète.

J'ai l'impression que ce script est payant !

[SpaceFrog]

payant ???
http://www.trirand.com/blog/?page_id=154

les cours d'anglais sont payants ^^

http://jquery.com/