Discussion :

[Jordan-Tess]

Bonjour,

Je rencontre actuellement un problème lors du chargement de ma datatable. J'ai une datatable qui contient un certain nombre de données triées par date ou plus exactement par terme (ex : Janvier 2015). Les données insérées peuvent dépasser la date courante, c'est à dire que je peux me retrouver avec des dates allant jusqu'en 2016 ou 2050.. . Ce que je souhaite, c'est que lorsque j'affiche ma datatable à mon utilisateur, celui ci se retrouve sur la page contenant la date du jour. Vous me suivez ?

Voici le code de ma datatable :

Code JavaScript :

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
oTableDA = $('#maTable').dataTable({
                        "jQueryUI" : true,
                        "iDisplayLength" : 6,
                        "bLengthChange": false,
                        "bInfo" : false,
                        "searching" : false,
                        "autoWidth": false,
                        "sPaginationType" : "simple_numbers",    
                        "sScrollable" : true,
                        "dom": 'T<"clear">lfrtip',
                        "order" : [[0,"desc"]],
                        "aoColumnDefs" : [
                            {
                                "data" : "DateSort",
                                "bVisible" : false,
                                "aTargets" : [0]
                            },
                            {
                                "sTitle" : "Date échéance",                
                                "data" : "Date",
                                "sWidth" : "40%",
                                "bSortable" : false,
                                "aTargets" : [1]
                            },
                            {
                                "sTitle" : "Montant",
                                "bSortable" : false,
                                "data" : "Montant",
                                "sClass" : "textCenter",
                                "sWidth" : "45%",
                                "aTargets" : [2]
                            },
                            {
                                "sTitle" : "Respecter",
                                "bSortable" : false,
                                "data" : "Respecter",
                                "sClass" : "textCenter imgDatatables",
                                "sWidth" : "15%",
                                "aTargets" : [3]
                            }
                        ],
                        "oLanguage": {
                            "oPaginate" : {
                                "sPrevious": "Préc.",
                                "sNext":     "Suiv.",
                                "sFirst" : "Prem.",
                                "sLast" : "Dern."
                            },
                            "sProcessing": "Chargement des données..",
                            "sEmptyTable": "Aucun détails"
                        },
                        "sAjaxSource" : "compte/recupDonnees"
        });

J'ai essayé de voir du côté de "sRowSelected" (https://datatables.net/extensions/ta...nitialisation#) de l'extension tableTools mais cela ne fonctionne pas.


Des idées ? Parce que moi j'en ai aucunes !

[Jordan-Tess]

J'ai réussi à régler mon problème !! . Voilà comment j'ai procédé pour ceux que ça intéresse :

• Tout d'abord, j'ai trié les données que j'insert dans ma datatable de la date la plus récente à la plus ancienne.
  
• Ensuite lors de l'envoie de mon JSON, je définit la classe de la ligne qui va être insérée avec les attributs "DT_RowData" et "DateSort" (http://www.datatables.net/manual/server-side) :
  
  

  Code PHP :

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

  1
  2
  3
  4
  5
  6
  $data['data'][$indice] = array("DT_RowClass" => "row_".$detail['DATE'],
                                                          "DT_RowData" => array("pkey"=> $detail['DATE']),
                                                          "DateSort"=>$detail['DATE'],
                                                          "Date"=> convertTerm($detail['DATE']),
                                                          "Montant" => $detail['MONTANT'],
                                                          "Respecter" => '');

  
  Ce qui va me permettre de manipuler chaque ligne par l’intermédiaire de sa classe. Ce qui devient très pratique car si on se retrouve avec plusieurs datatables, les lignes avec la classe sélectionnée sera identifier pour chacune d'elles.
  
  
• Enfin pour effectuer le traitement voulu, dans mon cas comparaison avec la date d'aujourd'hui, j'utilise la fonction fnInitComplete (http://legacy.datatables.net/usage/callbacks) :
  

  Code JavaScript :

  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
  "fnInitComplete": function(oSettings, json) {
                              var selector = ".rowAccord_";
                              for(var i=0;i < json.data.length;i++) {
   
                                  var today = new Date();
                                  var date= new Date(1,(json.data[i].DateSort).substring(4,6));                               
                                  date.setFullYear((json.data[i].DateSort).substring(0,4));                            
                                  //Si la 1ère date(la plus récente) est inférieur à celle d'aujourd'hui on sélectionne cette date
                                  if(i === 0 && compareDate(date,today) === -1){
                                      selector += json.data[i].DateSort;
                                      break;
                                  }
                                  else if(compareDate(today,date) === 0) {
                                      //on se place sur la bonne page
                                      this.fnPageChange(parseInt((i+1)/this.fnSettings()._iDisplayLength));
                                      selector += json.data[i].DateSort;
                                  }
                              }
                              $(selector).addClass("DTTT_selected selected");
                          }