Tabletools et jquery ui tabs
bonsoir
J'ai un soucis que je n'arrive pas à résoudre. En fait j'ai utilisé le module jquery tabs qui permet d'avoir un panneau avec des onglets.Sur ce panneau dans chaque onglet j'ai un datatable qui utilise tabletools prevu pour les exports de mon tableau en différent format.Tout marche bien sur mon premier onglet au niveau de l'export mais pas sur les autres onglet je ne peux cliquer sur pdf ca ne fais rien.Je vous met le code si quelqu'un peut m'aider.
MON CODE JS
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
| $(document).ready(function() {
$("#tabs").tabs();
});
$(document).ready(function() {
$('.monTableau').dataTable( {
"sPaginationType": "full_numbers",
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bAutoWidth": true ,
"oLanguage": {"sUrl" : "FR.txt"},
"bjQueryUI": true,
"sDom": 'T<"clear">lfrtip',
"oTableTools": {
"sSwfPath": "swf/copy_csv_xls_pdf.swf",
"aButtons": [ "copy",
{
"sExtends": "xls",
"sFileName": ".xls",
"bFooter": false
},
{
"sExtends": "csv",
"sFileName": ".csv",
},
{
"sExtends": "pdf",
"sFileName": ".pdf"
},
"print"
]
}
} );
} ); |
MON CODE HTML
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
| <div id="tabs">
<ul>
<li><a href="#tabs-1">Onglet 1</a></li>
<li><a href="#tabs-2">Onglet 2</a></li>
<li><a href="#tabs-3">Onglet 3</a></li>
</ul>
<div id="tabs-1">
<table class="monTableau">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>etc</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
<td>etc</td>
</tr>
<tr>
<td>Row 2 Data 1</td>
<td>Row 2 Data 2</td>
<td>etc</td>
</tr>
</tbody>
</table>
</div>
<div id="tabs-2">
<table class="monTableau">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>etc</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
<td>etc</td>
</tr>
<tr>
<td>Row 2 Data 1</td>
<td>Row 2 Data 2</td>
<td>etc</td>
</tr>
</tbody>
</table>
</div>
<div id="tabs-3">Contenu de l'onglet 3</div>
</div> |
