Bonjour,
J'ai plusieurs tables dans une page que je souhaite formater avec JQuery Datatable. Le problème c'est que uniquement la première table de la page prend le format et pas les autres. J'ai pourtant un relecteur JQuery adapté qui me retourne bien l'ensemble des tables de ma page quand je l'exécute à la main. Serait ce une limitation de DataTable ?
Voici un exemple :
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
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 <!DOCTYPE html> <html lang="fr"> <head> <title>Essai</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" media="screen"> </head> <body> <b>Table 1</b><br> <div style='width: 800px;'> <table id='TABLE_1' class='display compact'> <tbody> <tr> <td>2017-04-29 23:11:25</td> <td><span style='color: green;'>buy</span></td> <td>0.41045890</td> <td>0.02996349</td> <td> </td> <td>0.0015 %</td> </tr> <tr> <td>2017-04-29 20:37:21</td> <td><span style='color: red;'>sell</span></td> <td>0.41712695</td> <td> </td> <td>0.03084031</td> <td>0.0025 %</td> </tr> <tr> <td>2017-04-29 12:24:00</td> <td><span style='color: green;'>buy</span></td> <td>0.41438077</td> <td>0.02995971</td> <td> </td> <td>0.0025 %</td> </tr> <tr> <td>2017-04-29 10:14:14</td> <td><span style='color: red;'>sell</span></td> <td>0.41933667</td> <td> </td> <td>0.03041565</td> <td>0.0025 %</td> </tr> </tbody> </table> </div> <b>Table 2</b><br> <div style='width: 800px;'> <table id='TABLE_2' class='display compact'> <tbody> <tr> <td>2017-04-29 23:11:25</td> <td><span style='color: green;'>buy</span></td> <td>0.41045890</td> <td>0.02996349</td> <td> </td> <td>0.0015 %</td> </tr> <tr> <td>2017-04-29 20:37:21</td> <td><span style='color: red;'>sell</span></td> <td>0.41712695</td> <td> </td> <td>0.03084031</td> <td>0.0025 %</td> </tr> <tr> <td>2017-04-29 12:24:00</td> <td><span style='color: green;'>buy</span></td> <td>0.41438077</td> <td>0.02995971</td> <td> </td> <td>0.0025 %</td> </tr> <tr> <td>2017-04-29 10:14:14</td> <td><span style='color: red;'>sell</span></td> <td>0.41933667</td> <td> </td> <td>0.03041565</td> <td>0.0025 %</td> </tr> </tbody> </table> </div> <script type="text/javascript" defer="defer"> $(document).ready(function() { $("table[id^='TABLE']").DataTable( { "scrollY": "200px", "scrollCollapse": true, "searching": false, "paging": false } ); } ); </script> </body> </html>
Partager