Discussion :

[bip-bip]

Bonjour,

j'ai récupéré un script avec une datatable, j'ai voulu mettre un filtre sur les colonnes:
https://www.datatables.net/examples/...ti_filter.html

Cela fonctionne avec une table test en dur dans ma page, mais pas avec ma table rempli avec de vrais valeurs. Le filtre apparait en bas de la table mais aucune action.

Voilà le code de la table:

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
 
$('#personnes').dataTable({
                            "bPaginate": true,
                            "sPaginationType": "full_numbers",
                            "bLengthChange": true,
                            "iDisplayLength": 25, 
                            "bFilter": false,
                            "bSort": true,
                            "aaSorting": [
                                [1, 'asc']
                            ],
                            "bInfo": false,
                            "bAutoWidth": false,
                            "bProcessing": true,
                            "bServerSide": true,
                            "sAjaxSource": "index.php?json=1&liste=<?= $liste ?>",
                            "aoColumns": [
                                {"sClass": "methode", "aDataSort": [ 0, 1 ]},
                                { "sClass": "fiabilite",
                                    "mRender": function (data, type, row) {
                                        return row[1] + '%';
                                    },
                                    "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                                        if (parseInt(sData) < 70) {
                                            //$(nTd).css('font-weight', 'bold');
                                            nTd.className += ' douteux';
                                        }
                                        else {
                                            nTd.className += ' fiable';
                                        }
                                    },
                                    "aDataSort": [ 1, 3, 4 ]
                                },
                                {"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                                    if (sData == "<?= $etb ?>") {
                                        //$(nTd).css('font-weight', 'bold');
                                        nTd.className += ' etbActif';
                                    }
                                    else {
                                        nTd.className += ' autre';
                                    }
                                }
                                },
                                {"aDataSort": [ 3, 4, 1 ], "sClass": "nom"},
                                {"aDataSort": [ 4, 3, 1 ], "sClass": "nom"},
                                {"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                                    if (sData == "<?= $etb ?>") {
                                        nTd.className += ' etbActif';
                                    }
                                    else {
                                        nTd.className += ' autre';
                                    }
                                }
                                },
                                {"aDataSort": [ 6, 7 ], "sClass": "nom"},
                                {"aDataSort": [ 7, 6 ], "sClass": "nom"},
                                {
                                    "sClass": "annee",
                                    "aDataSort": [ 8, 3, 4]
                                },
                                { "bSearchable": false, "bVisible": false},
                                { "bSearchable": false, "bVisible": false},
                                { "bSearchable": false, "bVisible": false},
                                { "bSearchable": false, "bVisible": false},
                                { "bSearchable": false, "bVisible": false},
                                {
                                    "mData": null,
                                    "mRender": function (data, type, row) {
                                        return '<a href="detailDoublon.php?etb1=' +
                                                row[2] + '&etb2=' + row[5] + '&codEtu1=' + row[9] + '&codEtu2=' + row[10] +
                                                '&liste=<?= $liste ?>' + '">detail</a>';
                                    },
                                    "sClass": 'detail'
                                }
 
                            ],
....

Peut être une option, ou le fait que les données proviennent d'un sAjaxSource.

Avez vous une idée ?

Merci

[bip-bip]

Code :

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

1
2
3
4
    $('#personnes tfoot th').each( function () {
        var title = $('#personnes thead th').eq( $(this).index() ).text();
        $(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );

:

Avant l'appel a dataTable.

et après:

Code :

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

1
2
3
4
5
6
7
8
9
10
    // Apply the search
    table.columns().every( function () {
        var that = this;
 
        $( 'input', this.footer() ).on( 'keyup change', function () {
            that
                .search( this.value )
                .draw();
        } );
    } );