personnalisation tableau datatable
Bonjour, j'ai une petite question :D
Depuis un bon moment je construit mes tableaux de données manuellement que je récupère pour afficher des éléments contenu dans la base de données.
cette méthode est assez pratique mais un peu limite tout de même lors du traitement de pas mal d'enregistrement.
Pour le moment je fais comme ceci :
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
|
$.ajax({
url: 'json.php?list_pages=true',
dataType: 'json',
type: "get",
async: true,
cache:false,
beforeSend: function(){
$('#list_cms_pages').html('<img style="margin-left:450px;" class="tableloader" src="/img/loader/table-loader.gif" />');
},
success: function(j) {
$('#list_cms_pages').empty();
var tablecat = '<table class="ui-widget ui-widget-content" id="tablecontain">'
+'<thead><tr class="ui-widget ui-widget-header"><th>ID</th>'
+'<th style="width:1%;">Langue</th>'
+'<th style="min-width:200px;">Titre</th>'
+'<th>Contenu</th>'
+'<th>Metatitle</th>'
+'<th>Metadescription</th>'
+'<th>Date de création</th>'
+'<th style="width:16px;"><span class="lfloat dom-16-icon dom-16-icon-edit"></span></th>'
+'<th style="width:16px;"><span class="lfloat dom-16-icon dom-16-icon-delete"></span></th>'
+'</tr></thead>'
+'<tbody>';
tablecat += '</tbody></table>';
$(tablecat).appendTo('#list_cms_pages');
if(j === undefined){
console.log(j);
}
if(j !== null){
$.each(j, function(i,item) {
switch(item.contentpage){
case 1:
var content = '<span class="lfloat dom-16-icon dom-16-icon-check"></span>';
break;
case 0:
var content = '<span class="lfloat dom-16-icon dom-16-icon-important"></span>';
break;
}
switch(item.metatitle){
case 1:
var metaTitle = '<span class="lfloat dom-16-icon dom-16-icon-check"></span>';
break;
case 0:
var metaTitle = '<span class="lfloat dom-16-icon dom-16-icon-important"></span>';
break;
}
switch(item.metadescription){
case 1:
var metaDescription = '<span class="lfloat dom-16-icon dom-16-icon-check"></span>';
break;
case 0:
var metaDescription = '<span class="lfloat dom-16-icon dom-16-icon-important"></span>';
break;
}
return $('<tr>'
+'<td>'+item.idpage+'</td>'
+'<td>'+item.cms_lang+'</td>'
+'<td>'+item.titlepage+'</td>'
+'<td>'+content+'</td>'
+'<td>'+metaTitle+'</td>'
+'<td>'+metaDescription+'</td>'
+'<td>'+item.date_page+'</td>'
+'<td><a href="/cms.php?cms_pages=true&getidpage='+item.idpage+'"><span class="lfloat ui-icon ui-icon-pencil"></span></a></td>'
+'<td><a class="d-cms-pages" href="#" title="'+item.idpage+'"><span class="lfloat ui-icon ui-icon-closethick"></span></a></td>'
+'</tr>').appendTo('#tablecontain tbody');
});
}else{
return $('<tr>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'<td><span class="lfloat ui-icon ui-icon-minus"></span></td>'
+'</tr>').appendTo('#tablecontain tbody');
}
}
}); |
Cette méthode me permet d'afficher les éléments avec pour chacun un lien pour aller vers l'édition ainsi qu'un lien de suppression.
Je m'intéresse fortement à datatable qui semble très bien pour ce genre de chose.
Cependant est il possible d'avoir la même chose ?
Dans le sens que j'ai besoin pour chaque élément d'avoir son petit crayon d'édition qui amène vers une véritable page (impossible de l'éditer dans datatable étant trop gros).
Je n'ai pas vu ce genre d'exemple dans la documentation mais peut être l'avez vous déjà utiliser de cette manière :)
