IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

affichage par défaut en ordre descendant de la colonne "date"


Sujet :

JavaScript

  1. #1
    Membre à l'essai Avatar de Gmarin
    Homme Profil pro
    Retraité - Technicien maintenance informatique
    Inscrit en
    Juin 2012
    Messages
    21
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 80
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Retraité - Technicien maintenance informatique
    Secteur : Distribution

    Informations forums :
    Inscription : Juin 2012
    Messages : 21
    Points : 14
    Points
    14
    Par défaut affichage par défaut en ordre descendant de la colonne "date"
    bonjour,

    le tri de ma table par un javascript ne me laisse pas présenter celle-ci comme je le veux .
    Par défaut, sur les 5 colonnes dont 1 présente les dates, c'est celle des dates qui est triée par défaut, et de façon croissante . (plus petit vers plus grand)
    J'ai besoin de la présenter par défaut en tri décroissant .
    Que faut-il modifier : le script, et si oui , comment procéder, sachant que je ne sais que m'en servir ... ou / et faut-il modifier le code dans le <body>) ?

    voici le code dans le <head>, qui pointe vers les fichiers script :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    <!-- SCRIPT Tri table TableClips  -->
    <script type="text/javascript" src="tablesort.js">
    </script>
    <script type="text/javascript" src="customsort.js">
    </script>

    voici le code dans le <body> où la colonne "Date" reçoit sa fonction "sortable-sortEnglishDateTime" :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <thead class="thead">
        <tr>
            <th  width="220" class="sortable-text"scope="col">ARTISTE / GROUPE</th>
            <th  width="285" class="sortable-text" scope="col">TITRE</th>
            <th  width="60" class="sortable-text" scope="col">Media</th>
            <th  width="88" class="sortable-text" scope="col">Posteur</th>
            <th  width="137" class="sortable-sortEnglishDateTime" scope="col">Date</th>
          </tr>
        </thead>
     
    <?php include('TbodyTableClips.php'); ?>

    Voici le code de "customsort.js" qui porte la fonction sortEnglishDateTime :

    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
    var sortEnglishDateTime = fdTableSort.sortNumeric;
     
    function sortEnglishDateTimePrepareData(tdNode, innerText) {
            // You can localise the function here
            var months = ['january','february','march','april','may','june','july','august','september','october','november','december','jan','feb','mar','apr','may','jun','jul','aug','sep','oct','nov','dec'];
     
            // Lowercase the text
            var aa = innerText.toLowerCase();       
     
            // Replace the longhand and shorthand months with an integer equivalent
            for(var i = 0; i < months.length; i++) {               
                    aa = aa.replace(new RegExp(months[i] + '([\\s|,]{1})'), (i+13)%12 + " ");
            };
     
            // Replace multiple spaces and anything that is not valid in the parsing of the date, then trim
            aa = aa.replace(/\s+/g, " ").replace(/([^\d\s\/-:.])/g, "").replace(/^\s\s*/, '').replace(/\s\s*$/, '');
     
            // REMOVED: No timestamp at the end, then return -1
            //if(aa.search(/(\d){2} [decu]\d){2}( [decu]\d){2})?$/) == -1) { return -1; };
     
            // No timestamp at the end, then create a false one       
            if(aa.search(/(\d){2} [decu]\d){2}( [decu]\d){2})?$/) == -1) { aa += " 00:00:00"; };
     
     
            // Grab the timestamp
            var timestamp = aa.match(/(\d){2} [decu]\d){2}( [decu]\d){2})?$/)[0].replace(/:/g, "");
     
            // Make the timestamp 6 characters by default
            if(timestamp.length == 4) { timestamp += "00"; };
     
            // Remove it from the string to assist the date parser, then trim
            aa = aa.replace(/(\d){2} [decu]\d){2}( [decu]\d){2})?$/, "").replace(/\s\s*$/, '');
     
            // If you want the parser to favour the parsing of European dd/mm/yyyy dates then leave this set to "true"
            // If you want the parser to favour the parsing of American mm/dd/yyyy dates then set to "false"
            var favourDMY = true;
     
            // If you have a regular expression you wish to add, add the Object to the end of the array
            var dateTest = [
                           { regExp:/^(0?[1-9]|1[012])([- \/.])(0?[1-9]|[12][0-9]|3[01])([- \/.])((\d\d)?\d\d)$/, d:3, m:1, y:5 },  // mdy
                           { regExp:/^(0?[1-9]|[12][0-9]|3[01])([- \/.])(0?[1-9]|1[012])([- \/.])((\d\d)?\d\d)$/, d:1, m:3, y:5 },  // dmy
                           { regExp:/^(\d\d\d\d)([- \/.])(0?[1-9]|1[012])([- \/.])(0?[1-9]|[12][0-9]|3[01])$/, d:5, m:3, y:1 }      // ymd
                           ];
     
            var start,y,m,d;
            var cnt = 0;
            var numFormats = dateTest.length;
            while(cnt < numFormats) {
                   start = (cnt + (favourDMY ? numFormats + 1 : numFormats)) % numFormats;
                   if(aa.match(dateTest[start].regExp)) {
                           res = aa.match(dateTest[start].regExp);
                           y = res[dateTest[start].y];
                           m = res[dateTest[start].m];
                           d = res[dateTest[start].d];
                           if(m.length == 1) m = "0" + String(m);
                           if(d.length == 1) d = "0" + String(d);
                           if(y.length != 4) y = (parseInt(y) < 50) ? "20" + String(y) : "19" + String(y);
     
                           return y+String(m)+d+String(timestamp);
                   };
                   cnt++;
            };
            return -1;
    };
    Merci d'avance pour votre aide ....

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 056
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 056
    Points : 44 578
    Points
    44 578
    Par défaut
    Bonjour,
    d'après les sources, voir tablesort.js, tu peux affecter à ta colonne la class forwardSort ou reverseSort.

    donc je mettrais
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <th  width="137" class="sortable-sortEnglishDateTime reverseSort" scope="col">Date</th>

  3. #3
    Membre à l'essai Avatar de Gmarin
    Homme Profil pro
    Retraité - Technicien maintenance informatique
    Inscrit en
    Juin 2012
    Messages
    21
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 80
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Retraité - Technicien maintenance informatique
    Secteur : Distribution

    Informations forums :
    Inscription : Juin 2012
    Messages : 21
    Points : 14
    Points
    14
    Par défaut
    Merci NoSmoking,

    mais sans effet, la table se charge toujours avec la colonne Date triée en ordre ascendant ....

    note : TableSort revisited v5.0 by frequency-decoder.com

  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 056
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 056
    Points : 44 578
    Points
    44 578
    Par défaut
    mais sans effet, la table se charge toujours avec la colonne Date triée en ordre ascendant ....
    cela parraît normal, tu ne lances pas le tri!

    Dans leur exemple il mettent un sortable-onload-x, où x est visiblement la colonne à trier commençant à 0, qui permet de trier au chargement, dans ton cas je mettrais donc
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <table id="TableClips" class="TableClips sortable-onload-x" cellspacing="0" cellpadding="0">
    sans aucune garantie.

    Question peut être stupide, pourquoi ne pas gérer cela coté serveur, directement en PHP?

  5. #5
    Membre à l'essai Avatar de Gmarin
    Homme Profil pro
    Retraité - Technicien maintenance informatique
    Inscrit en
    Juin 2012
    Messages
    21
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 80
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Retraité - Technicien maintenance informatique
    Secteur : Distribution

    Informations forums :
    Inscription : Juin 2012
    Messages : 21
    Points : 14
    Points
    14
    Par défaut
    Oulah, aprrendre le PHP, à 68 ans .... je ne suis pas partisan des Universités du 5° âge ....

    Bon, j'ai essayé le "sortable-onload-x" (col 4 pour ma table), mais sans succès ....

    Merci pour ton aide, NoSmoking .

  6. #6
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 056
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 056
    Points : 44 578
    Points
    44 578
    Par défaut
    Il n'y a pas d'âge pour apprendre

    Une astuce, pourrait te permettre de t'en sortir avant que d'apprendre le PHP, est de mettre une ID à la TH que tu souhaites trier et sur le onload du BODY tu simules un click
    dans
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <table id="TableClips" class="TableClips sortable-onload-x" cellspacing="0" cellpadding="0">
    est à conserver


    on ajoute l'ID
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <th id="th_click" class="sortable-sortEnglishDateTime" width="137" scope="col">

    et l'événement sur le BODY par exemple
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <body onload="document.getElementById('th_click').click();">

  7. #7
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 056
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 056
    Points : 44 578
    Points
    44 578
    Par défaut
    J'ai regardé un peu plus avant le code et il s’avère que ton cas est prévu, je me disais aussi.

    Il te suffit donc d'écrire simplement
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <table id="TableClips" class="TableClips sortable-onload-4r" cellspacing="0" cellpadding="0">
    le petit r signifie que le tri doit être réalisé comme reverseSort.

    EDIT :
    Pour un tri forwardSort, mettre un petit f.
    inutile c'est la valeur par défaut

    Donc oubli ma réponse précédente.

  8. #8
    Membre à l'essai Avatar de Gmarin
    Homme Profil pro
    Retraité - Technicien maintenance informatique
    Inscrit en
    Juin 2012
    Messages
    21
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 80
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Retraité - Technicien maintenance informatique
    Secteur : Distribution

    Informations forums :
    Inscription : Juin 2012
    Messages : 21
    Points : 14
    Points
    14
    Par défaut
    RESPECT ..... Mr NoSmoking

    Ma table, revisited by NoSmoking !

    C'était "on ne peut plus simple", encore fallait-il trouver dans le code l'indication de ce paramètre .....
    Bon, Table finalisée, sans PHP

    Encore merci ....

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Restaurer les paramètres d'affichage par défaut
    Par lehanslee dans le forum KDE
    Réponses: 2
    Dernier message: 27/11/2008, 12h00
  2. Réponses: 5
    Dernier message: 17/11/2008, 09h57
  3. [select] Affichage par défaut
    Par yas13 dans le forum Servlets/JSP
    Réponses: 2
    Dernier message: 20/08/2008, 17h03
  4. Réponses: 3
    Dernier message: 24/04/2008, 11h42
  5. Réponses: 1
    Dernier message: 27/04/2007, 15h03

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo