Publicité
+ Répondre à la discussion
Affichage des résultats 1 à 20 sur 20
  1. #1
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut Affichage valeur Ajax

    Salut tout le monde, je suis tout nouveau sur ce forum donc désolé si je me suis trompé de section ^^
    je réalise actuellement un site, comme chaque site il y a un contenu, mais il y a aussi une div appelé "flash" (pour information flash), dans la base de donnée il peut y avoir une, deux... X flash et ce que je souhaiterais, c'est que toutes les flash s'affichent dans le coin "flash" a intervalle régulière
    Problème : j'arrive a afficher les info flash avec une intervalle, MAIS je suis obligé de cliquer sur chaque info flash (j'ai fais une boucle foreach en php pour afficher leurs id) ce qui signifie qu'elles ne se chargent pas automatiquement, autre problème, l'intervalle n'est pas régulière, j'ai crus voir que si je fixais une intervalle de 8secondes, pour 3 flash disponible, 2 flash feraient leurs apparitions en 1secondes chacune et la dernière prendrait les 8secondes restantes. J'espère avoir été le plus clair possible en ce qui concerne le contexte ^^

    Maintenant un peu de code :

    Le code JS qui me permet de faire ce qui a déjà été réalisé :
    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
    <script type="text/javascript" charset="UTF-8">
     
        function getRequeteHttp(){
     
            var xhr=null;
            if (window.XMLHttpRequest){ //navigateurs non MS
                xhr=new XMLHttpRequest();
            }
            else
                if (window.ActiveXObject){ //versions de MS IE
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }
            else {
                alert("navigateur non comptatible Ajax...");
            }
            return xhr;
        }
     
        function recevoirReponse(xhr){
            if (xhr.readyState == 4 && xhr.status==200) {
                interval = setTimeout(function(){changeMessage(xhr.responseText)},10000); //setinterval
            }
        }
     
        function getFlash(idFlash){
            var xhr = getRequeteHttp();
            xhr.open("POST", "vues/v_chercherFlash.php", true);
            xhr.onreadystatechange = function(){
                recevoirReponse(xhr);
            }
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            xhr.send("idFlash="+ idFlash);
        }
     
        function changeMessage(xhr){
     
            texte=xhr.split('/');
            document.getElementById("libelle").innerHTML=texte[1];
            document.getElementById("Contenu").innerHTML=texte[2];
            document.getElementById("dateD").innerHTML=texte[3];
            document.getElementById("dateF").innerHTML=texte[4];
        }
    </script>
    La partie Flash qui me permet de réaliser l'affichage :
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    <div id="flash">
        <span id="dateD"></span>
        <span id="dateF"></span><br>
        <span id="libelle"></span><br>
        <span id="Contenu"></span><br>
     
        <?php
        $i = 1;
        foreach ($desFlash as $uneFlash) {
            $id = $uneFlash['id'];
            ?>
            <a href='#' onclick='getFlash(<?php echo $id; ?>)'><?php echo $i; ?></a>
     
            <?php
            $i++;
        }
        ?>
    </div>

    Enfin, si ça peut aider, la partie qui fabrique la ligne flash :
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    require_once '../include/class.pdoamicales.inc.php';
    $pdo = PdoAmicales::getPdoAmicales();
            $idFlash = $_POST['idFlash'];
            $flash=$pdo->getLesFlash($idFlash);
     
            echo $flash[0]['id'];
     
            if (count($flash) != 0) {
                echo $flash[0]['id'] . "/" . $flash[0]['libelle'] . "/" . $flash[0]['contenu'] . "/"
                . $flash[0]['dateD'] . "/" . $flash[0]['dateF'] . "/";
            }

    j'avais réalisé une recherche sur le net, mais rien ne correspondant a mon cas précis,
    je vous remercie d'avances pour vos réponses et désolé si j'ai mal utilisé les balises!

  2. #2
    Membre éprouvé
    Homme Profil pro Yann
    IUT Informatique
    Inscrit en
    mars 2011
    Messages
    411
    Détails du profil
    Informations personnelles :
    Nom : Homme Yann
    Localisation : France

    Informations professionnelles :
    Activité : IUT Informatique

    Informations forums :
    Inscription : mars 2011
    Messages : 411
    Points : 455
    Points
    455

    Par défaut

    Salut,

    J'ai un peu de mal à tout comprendre ^^. Mais pour tes flash info, ton contenu à afficher il est bien récupérer par la fonction getFlash() ?

    Pour ton intervalle tu parle de celui qui tu met dans setTimeout?

  3. #3
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Enfaite, pour l'instant j'ai 3 flash, avec la boucle foreach, ça m'affiche :
    1 2 3
    Chacun a son value de flash, le problème, c'est que ça m'affiche que 1 2 3 alors que je voudrais que ça m'affiche automatiquement le contenu de la flash 1, après 4secondes par exemple le contenu de la flash 2, 4secondes après le contenu de la flash 3 et on revient a la flash 1.
    Seulement, pour l'affichage d'une flash, je dois cliquer dessus, c'est le premier problème.
    Le second problème est la durée d'affichage : les 3 flash ne sont pas affiché avec une même durée, une va être affiché 8secondes, et les deux autres seront affiché 1seconde chacune, le temps est respecté je crois, il affiche bien les 3 flash pour une durée de 10secondes, mais le temps d'affichage n'est pas équilibré. Pour complexifier la chose, il peut y avoir 2 flash, comme il peut y en avoir 8

  4. #4
    Membre éprouvé
    Homme Profil pro Yann
    IUT Informatique
    Inscrit en
    mars 2011
    Messages
    411
    Détails du profil
    Informations personnelles :
    Nom : Homme Yann
    Localisation : France

    Informations professionnelles :
    Activité : IUT Informatique

    Informations forums :
    Inscription : mars 2011
    Messages : 411
    Points : 455
    Points
    455

    Par défaut

    Okok, alors en faite, ça t'affiche 1 2 et 3 parce que tu fais uniquement un echo de $i, et le contenu tu le charge uniquement au onclick. il faut revoir le fonctionnement. Moi je ferai un truc de ce style (je te fais un exemple en mode léger)

    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
     
    <script type="text/javascript">
     
    function getFlash(idFlash)
    {
       // Récupère tous les flash
       // Tu récupère le nombre total de flash et tu affecte cette valeur à idMax
       afficheFlash(listeFlash,0);        
    }
     
    function afficheFlash(listeFlash,idFlash)
    {
      // J'utilise la syntaxe jQuery j'utilise ça le plus souvent et j'ai pas en tête la syntaxe native à JS. C'est fort possible que je me trompe aussi dans la syntaxe pour extraire les données, tout dépend comment est formaté ton retour.
    // En gros, je vide chaque span, puis je met la nouvelle valeur en fonction de son id.
       $("#dateD").empty().html(listeFlash[idFlash][dateD]);
       $("#dateF").empty().html(listeFlash[idFlash][dateF]);
       $("#libelle").empty().html(listeFlash[idFlash][libelle]);
       $("#Contenu").empty().html(listeFlash[idFlash][Contenu]);
       if(idFlash == idMax)
         idFlash = 0;
       else
         idFlash++;
       setTimeout(afficheFlash(listeFlash,idFlash),10000);
    }
    </script>
    <div id="flash">
        <span id="dateD"></span>
        <span id="dateF"></span><br>
        <span id="libelle"></span><br>
        <span id="Contenu"></span><br>
    </div>

  5. #5
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Je te remercie de ta réponse, je vais essayer et je te tiens au courant

    j'y repense, mais je ne connais rien au Jquery :s j'ai fais de l'ajax cette année,

  6. #6
    Membre éprouvé
    Homme Profil pro Yann
    IUT Informatique
    Inscrit en
    mars 2011
    Messages
    411
    Détails du profil
    Informations personnelles :
    Nom : Homme Yann
    Localisation : France

    Informations professionnelles :
    Activité : IUT Informatique

    Informations forums :
    Inscription : mars 2011
    Messages : 411
    Points : 455
    Points
    455

    Par défaut

    Tu dois avoir des équivalent en natif. Je sais que html tu peux le remplacer par innerHTML mais empty je sais pas du tout l'équivalent ...

  7. #7
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Sinon j'avais pensé a autre chose,
    charger toutes les flash avec ma fonction php (donc je n'envoie pas d'id)
    je fais un premier split / pour différencier les différentes parties d'une flash et un autre split - pour différencier les flash
    mais je crois que je me torture un peu trop l'esprit, non?

  8. #8
    Membre éprouvé
    Homme Profil pro Yann
    IUT Informatique
    Inscrit en
    mars 2011
    Messages
    411
    Détails du profil
    Informations personnelles :
    Nom : Homme Yann
    Localisation : France

    Informations professionnelles :
    Activité : IUT Informatique

    Informations forums :
    Inscription : mars 2011
    Messages : 411
    Points : 455
    Points
    455

    Par défaut

    Possible que tu te torture l'esprit ^^.

    J'ai un peu relu ce que t'as fais, je pense que si tu utilise ta fonction getLesFlash, tu encode en JSON pour que ce soit léger et tu le renvois à ta fonction ajax, et après t'as plus qu'à traiter par rapport à l'id (si tes id fonctionnent comme des indices de tableau).

    Je sais pas si je me suis bien expliqué sur la méthode que j'aurai utilisé ^^

  9. #9
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    je pars sur une nouvelle idée qui devrait être moins prise de tête

    Code pour l'affichage (qui n'affiche pas encore^^) :
    Code html :
    1
    2
    3
    4
    5
    6
    7
    <div id="flash">
        <span id="dateD"></span>
        <span id="dateF"></span><br>
        <span id="libelle"></span><br>
        <span id="Contenu"></span><br>
        <a href='#' onload='getFlash()'></a>
    </div>


    Le script php qui réupère toutes les flash (les champs sont séparés par des / et les flash par des --)
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    <?php
    /**
     * Dans le même dossier que le script Ajax (pour les flash). 
     */
     
    require_once '../include/class.pdoamicales.inc.php';
    $pdo = PdoAmicales::getPdoAmicales();
            $lesFlash=$pdo->getDesFlash(); //on récupère toutes les flash
     
            if (count($flash) != 0) {
                foreach($lesFlash as $flash)//on parcourt toutes les flash
     
                echo $flash[0]['id'] . "/" . $flash[0]['libelle'] . "/" . $flash[0]['contenu'] . "/"
                . $flash[0]['dateD'] . "/" . $flash[0]['dateF'] . "--";//on affecte a toutes les flash un contenu séparé par des / , et les flash séparé entre elle par des --
     
            }
    ?>

    Enfin le 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
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    <script type="text/javascript" charset="UTF-8">
     
        function getRequeteHttp(){
     
            var xhr=null;
            if (window.XMLHttpRequest){ //navigateurs non MS
                xhr=new XMLHttpRequest();
            }
            else
                if (window.ActiveXObject){ //versions de MS IE
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }
            else {
                alert("navigateur non comptatible Ajax...");
            }
            return xhr;
        }
     
        function recevoirReponse(xhr){
            if (xhr.readyState == 4 && xhr.status==200) {
                interval = setTimeout(function(){changeMessage(xhr.responseText)},10000); //setinterval
            }
        }
     
        function getFlash(){
            var xhr = getRequeteHttp();
            xhr.open("POST", "vues/v_chercherFlash.php", true);
            xhr.onreadystatechange = function(){
                recevoirReponse(xhr);
            }
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            xhr.send(null);
        }
     
        function changeMessage(xhr){
            var i=0;
            var y=1;
            flash=xhr.split('--');//on sépare les flash
            while(flash[i]=!null){//tant qu'on a une flash ..
                texte=flash[i].split('/');//on sépare les champs de la flash
     
                document.getElementById("libelle").innerHTML=texte[y];
                y++;
                document.getElementById("Contenu").innerHTML=texte[y];
                y++;
                document.getElementById("dateD").innerHTML=texte[y];
                y++;
                document.getElementById("dateF").innerHTML=texte[y];
                y=y+2;
                i++;
            }
        }
    </script>

    Edit: Enfaite je viens de rajouter onload au body.. et j'ai fais un alert, j'ai modifié le petit truc qui n'allait pas en php, j'ai fais un alert de xhr , et j'obtient... l'id de chaque flash, exemple 6/6/6/6/6-8/8/8/8/8-9/9/9/9/9, je crois qu'on y est presque..


    Edit : je vous tiens au courant des avancées quand même... le onload se fait bien, mes split se font bien, le problème, c'est que mes <span> affichent undifined SAUF si je fais un alert quelconque... a ce moment la ça m'affiche bien le résultat, sauf que je n'ai pas vraiment envie que l'utilisateur ai a se taper la boucle de flash dés son arrivé esur le site..

  10. #10
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Voici la dernière version du script :
    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
        function changeMessage(xhr){
     
            var i=0;
            var y=1;
            var t;
     
            flash=xhr.split('--');//les flash sont splité
     
            for(t=0; t<flash.length-1;t++){//on parcourt les flash
     
             texte=flash[i].split('/');//notre flash est splité
     
            var horloge = new Date();//instanciation d'une date'
            var time = horloge.getTime();//on veut le temps en ms depuis 1970
            var temps = horloge.getTime();//premiere date de référence temps
     
            while(5000>(temps-time)){//boucle affichage
                var horlogeTps = new Date();//on re instancie une nouvelle date, la date faite en dehor de la boucle n'est plus fiable'
                temps = horlogeTps.getTime();//on affecte a temps sa nouvelle valeur
                //alert("dans la boucle "+ (temps-time));
                alert(temps);
     
     
                document.getElementById("libelle").innerHTML=texte[1];
                y++;
                document.getElementById("Contenu").innerHTML=texte[2];
                y++;
                document.getElementById("dateD").innerHTML=texte[3];
                y++;
                document.getElementById("dateF").innerHTML=texte[4];
                //5000ms, on sort de la boucle while, mais logiquement on retourne en haut de la boucle for
            }
     
        }            
    }
    Le problème : c'est que les valeurs changent uniquement avec des alertes, par exemple, si j’enlève alert(temps); firefox va tout d'abord buguer, afficher les valeurs la ou il le faut sur les span et m'annoncer un message comme quoi le script a planté.. continuer ou stopper, même si j fais continuer... le script ne se relance pas,
    Ensuite, avec le alert(temps) cette fois, il semblerait que les informations s'actualisent environ toutes les 5secondes, mais ne boucle pas a l'infini( arrivé a la dernière flash, le script s'arrête), c'est pas encore bon mais y a du mieux

  11. #11
    Membre du Club

    Homme Profil pro Sébastien DAMART
    Développeur Web
    Inscrit en
    septembre 2012
    Messages
    29
    Détails du profil
    Informations personnelles :
    Nom : Homme Sébastien DAMART
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : septembre 2012
    Messages : 29
    Points : 63
    Points
    63

    Par défaut

    Quelque critique si tu me le permet :
    Tu utilise trop de tableau dans tout les sens au bout d'un moment tu va forcément finir par t'y perdre. tu part dans la bonne direction néanmoins.
    Le JavaScript possède un outil puissant le JSON
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    var _a=xhr.split('--');
    var _array=[];
    for(var fl in a){
    if(fl!=undefined)//à cause du -- de trop à la fin 
    var flash={
    libelle:fl.split('#')[1],
    contenu:fl.split('#')[2],
    dateD:fl.split('#')[3],
    dateF:fl.split('#')[4]
    }
    _array.push(flash);
     
    }
    tu récupère en AJAX tout les flashs et tu les stock dans un tableau JS et pour les récupèrer, il suffit d'utiliser la syntaxe
    Voila il ne reste plus qu'a itérer.
    Là encore, tu partais dans la bonne direction mais jamais tu ne ré-itére la fonction donc elle tourne pas en boucle.

    Exemple
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    //le tableau de flashs est chargé
    var interval={}//stocker le setTimeout
    index=0;//index pour le parcours
    function refreshFlashView(){
    clearTimeout(interval)//ainsi en cas de pépin, l'erreur ne tournera pas en boucle
      document.getElementById("libelle").innerHTML=_array[index].libelle;
      document.getElementById("contenu").innerHTML=_array[index].contenu;
    [...]
    if(index+1<_array.length){
     index++;
    }else
    index=0;
    interval=setTimeout(refreshFlashView,1000);
    }
    Voila logiquement ça doit résoudre ton problème.

  12. #12
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Je débute en javascript, je l'apprend en cours, je suis pour l'instant limité a ajax, j'ai déjà entendu parler de Json et de Jquery qui semblent être de formidable outils, mais je ne les connais pas (encore).
    Je viens quand même de regarder quelques exemples sur le net..
    ça me fais un peu penser a DOM et a l'utilisation du XML, non?

  13. #13
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Pour le Json, je ne vois pas comment l'adapter a mon script,
    De plus, après avoir de nouveau testé le script, enfaite il plante, et me propose de continuer ou d'arrêter le script (difficile a dire si niveau algo il fonctionne), du fait qu'il plante, il affiche directement la dernière valeur

    Edit : j'ai testé le script avec l'outil Ardoise Javascript et j'obtient ça en commentaire après la tentative d'éxécution :
    /*
    Exception: syntax error
    @Scratchpad:1
    */
    /*
    undefined
    */

  14. #14
    Membre du Club

    Homme Profil pro Sébastien DAMART
    Développeur Web
    Inscrit en
    septembre 2012
    Messages
    29
    Détails du profil
    Informations personnelles :
    Nom : Homme Sébastien DAMART
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : septembre 2012
    Messages : 29
    Points : 63
    Points
    63

    Par défaut

    Pour le JSON, il s'agit d'un système de notation rapide pour générer des objet à la volée.
    En JavaScript (comme dans n'importe quel langage) il faut éviter les codes trop lourd
    Si j'écris
    Code :
    1
    2
    3
    4
    5
    6
    var _a=new Array();
     _a[0][0]="libellé1";
    _a[0][1]="Desc_1";
    _a[0][2]="info1";
    _a[0][3]="info12";
    [...]
    On constate 4 lignes de code pour chaque item: ça fait un peu lourd
    Alors qu'en JSON
    Code :
    1
    2
    3
    4
    var _a=[
    ["libelle1","desc_1","info1",info12"],
    [...]
    ]
    C'est plus synthétique mais j'ai intérêt à apprendre l'index des information si je veux modifier mon code plus loin
    Si j'écris
    Code :
    1
    2
    3
    4
    var _a=[
    {libelle:"libelle1",descripif:"desc_1",info1:"info1",info2:info12"},
    [...]
    ]
    Chaque occurrence du tableau n'est plus un tableau mais un objet dédié.
    Donc je peu appeler
    qui est plus clair que
    Dans ton dernier code tu soirt un tableau à deux dimensions
    La première constitue l'ensemble de tes flashs info et la seconde les flashs info en eux même
    Plus tôt que de jongler avec les index des tableau mieux vaut dédié des champs
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    var _a=[]//je déclare un tableau
    for(var flash in xhr.split('--')){//pour chaque occurrence du tableau 
    var item={//je déclare un objet qui représente le flash info
    libelle:flash.split('/')[1]//je créer un attribut libellé 
    [...] //ainsi de suite
    }
    //j'intégre l'objet dans mon tableau
    _a.push(item);
    }
    Mais comme tu peux le constater, le JSON à pas beaucoup d'intérêt.
    Et si on décidé de récupérer le JSON directement du serveur
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <?php
    require_once '../include/class.pdoamicales.inc.php';
    $pdo = PdoAmicales::getPdoAmicales();
            $lesFlash=$pdo->getDesFlash(); //on récupère toutes les flash
           $jsonResult=array();
            if (count($flash) != 0) {
                foreach($lesFlash as $flash)//on parcourt toutes les flash
     
                 $jsonResult[]="{ID:\"". $flash[0]['id'] . "\",libelle:\"" . $flash[0]['libelle'] . "\",contenu:\"" . $flash[0]['contenu'] . "\",dateD:\""
                . $flash[0]['dateD'] . "\",dateF" . $flash[0]['dateF'] . "}";//On inserer un objet JSON formater au tableau
     
            }
    echo "[".implode(',',$jsonResult)."]";//on affiche les occurrences tableau sous forme de chaine de caractère séparer par une "," encadré par des"[]" pour symboliser le tableau
    ?>
    Coté JS tu trouvera
    Code :
    var _a=eval('('+xhr+')');
    et fini

  15. #15
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Enfaite la je suis perdu, voici le code actuel :

    v_chercherFlash.php :
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    <?php
    /**
     * Dans le même dossier que le script Ajax (pour les flash). 
     */
     
    require_once '../include/class.pdoamicales.inc.php';
    $pdo = PdoAmicales::getPdoAmicales();
            $lesFlash=$pdo->getDesFlash(); //on récupère toutes les flash
     
            if (count($lesFlash) != 0) {
                foreach($lesFlash as $flash)//on parcourt toutes les flash
     
                echo $flash['id'] . "/" . $flash['libelle'] . "/" . $flash['contenu'] . "/"
                . $flash['dateD'] . "/" . $flash['dateF'] . "--";//on affecte a toutes les flash un contenu séparé par des / , et les flash séparé entre elle par des --
     
            }
    ?>
    le code js de v_message.php :
    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
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    <script type="text/javascript" charset="UTF-8">
     
        function getRequeteHttp(){
     
            var xhr=null;
            if (window.XMLHttpRequest){ //navigateurs non MS
                xhr=new XMLHttpRequest();
            }
            else
                if (window.ActiveXObject){ //versions de MS IE
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }
            else {
                alert("navigateur non comptatible Ajax...");
            }
            return xhr;
        }
     
     
        function getFlash(){
            var xhr = getRequeteHttp();
            xhr.open("POST", "vues/v_chercherFlash.php", true);
            xhr.onreadystatechange = function(){
                recevoirReponse(xhr);
            }
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            xhr.send(null);
        }
     
        function recevoirReponse(xhr){
            if (xhr.readyState == 4 && xhr.status==200) {
                changeMessage(xhr.responseText); //setinterval
            }
        }
     
     
     
        function changeMessage(xhr){
     
            var i=0;
            var y=1;
            var t;
     
            flash=xhr.split('--');//les flash sont splité
     
            for(i=0; i<flash.length-1;i++){//on parcourt les flash
     
     
     
                texte=flash[i].split('/');//notre flash est splité
                alert(flash[i]);
                var horloge = new Date();//instanciation d'une date'
                var time = horloge.getTime();//on veut le temps en ms depuis 1970
                var temps = horloge.getTime();//premiere date de référence temps
     
                while(5000>(temps-time)){//boucle affichage
                    var horlogeTps = new Date();//on re instancie une nouvelle date, la date faite en dehor de la boucle n'est plus fiable'
                    temps = horlogeTps.getTime();//on affecte a temps sa nouvelle valeur
                    //alert("dans la boucle "+ (temps-time));
     
     
                    document.getElementById("libelle").innerHTML=texte[1];
                    y++;
                    document.getElementById("Contenu").innerHTML=texte[2];
                    y++;
                    document.getElementById("dateD").innerHTML=texte[3];
                    y++;
                    document.getElementById("dateF").innerHTML=texte[4];
                    //5000ms, on sort de la boucle while, mais logiquement on retourne en haut de la boucle for
                }
     
            }            
        }
    </script>
    Enfaite, le code que vous me fournissez... je ne sais pas où le placer, c'est une syntaxe que je ne connais pas (encore)

  16. #16
    Membre éprouvé
    Homme Profil pro Yann
    IUT Informatique
    Inscrit en
    mars 2011
    Messages
    411
    Détails du profil
    Informations personnelles :
    Nom : Homme Yann
    Localisation : France

    Informations professionnelles :
    Activité : IUT Informatique

    Informations forums :
    Inscription : mars 2011
    Messages : 411
    Points : 455
    Points
    455

    Par défaut

    Salut,

    Je pense que t'y est presque mais il te faut juste bien réussir à récupérer toutes les données et ajusté comme il faut le changement auto.

    Une possible solution, à arranger et corriger. Ca ressemble beaucoup à la première solution que je t'ai proposé mais je pense que c'est l'approche à avoir
    Code php :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <?php
    /**
     * Dans le même dossier que le script Ajax (pour les flash). 
     */
     
    require_once '../include/class.pdoamicales.inc.php';
    $pdo = PdoAmicales::getPdoAmicales();
            $lesFlash=$pdo->getDesFlash(); //on récupère toutes les flash
            echo $lesFlash
    ?>

    La tu renvoie ton tableau brut avec tous tes flashs

    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
    55
    56
    57
     
    <script type="text/javascript" charset="UTF-8">
         var idEnCours = 0;
        var idMax = 0;
        function getRequeteHttp(){
     
            var xhr=null;
            if (window.XMLHttpRequest){ //navigateurs non MS
                xhr=new XMLHttpRequest();
            }
            else
                if (window.ActiveXObject){ //versions de MS IE
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }
            else {
                alert("navigateur non comptatible Ajax...");
            }
            return xhr;
        }
     
     
        function getFlash(){
            var xhr = getRequeteHttp();
            xhr.open("POST", "vues/v_chercherFlash.php", true);
            xhr.onreadystatechange = function(){
                recevoirReponse(xhr);
            }
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            xhr.send(null);
        }
     
        function recevoirReponse(xhr){
            if (xhr.readyState == 4 && xhr.status==200) {
                idMax = xhr.lenght;
                changeMessage(xhr); //setinterval
            }
        }
     
     
     
    function changeMessage(xhr){
       document.getElementById("libelle").innerHTML=xhr[idEnCours]['libelle'];
       document.getElementById("Contenu").innerHTML=xhr[idEnCours]['Contenu'];
       document.getElementById("dateD").innerHTML=xhr[idEnCours]['dateD'];
       document.getElementById("dateF").innerHTML=xhr[idEnCours]['dateF'];
     
       if(idEncours == idMax)
       {
           idEnCours = 0;
       }
       else
       {
          idEnCours++;
       }
       setTimeout(changeMessage(xhr),'8000');
     }
    </script>
    Donc en gros, tu récupère le tableau avec tous tes flash.
    Tu appel une fonction pour afficher le premier flash. Ensuite on incrémente de 1 la variable idEnCours pour afficher le flash suivant quand la fonction sera rappeler. Puis ensuite tu indique que la fonction changeMessage sera rappelé au bout de 8000ms

  17. #17
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    j'ai testé le script, avec la console développeur web de firefox activé, idEnCours n'est pas défini
    et typeError xhr[idEnCours] is undifined

  18. #18
    Membre du Club

    Homme Profil pro Sébastien DAMART
    Développeur Web
    Inscrit en
    septembre 2012
    Messages
    29
    Détails du profil
    Informations personnelles :
    Nom : Homme Sébastien DAMART
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : septembre 2012
    Messages : 29
    Points : 63
    Points
    63

    Par défaut

    Paradoxalement, l'AJAX ce joue essentiellement coté serveur.
    I.E la façon dont les données sont formatées.
    Si ton serveur retourne une chaine CVS (libelle1|desc_1|12.8#libelle2|desc_2|21.8)
    Il faut prévoir un script pour transformer cela coté client
    exemple
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    var result=xhr.responseText//reponse du serveur
    var _a=[]
    for(i=0;i<result.split('#');i++){//pour chaque produit de mon tableau
     _a.push({
    libelle:result[i].split('|')[0],
    desc:result[i].split('|')[1],
    prix:result[i].split('|')[2]
    })
    }
    Mais voit comme cette construction est lourde.
    En revenche, si ton serveur retourne une chaîne JSON
    [{libelle:"libelle1",desc:"desc1",prix:12.80},{libelle:"libelle2",desc:"desc2",prix:21.80}]
    Coté client c'est des vacance !
    Code :
    var _a=eval('('+xhr.responseText+')');
    Le code que je te fournis c'est une alternative au tiens pour faciliter ton travail coté client et te permettre de te concentrer sur le setTimeout qui semble être le noeud de ton problème.

  19. #19
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Il semblerait que ça se rapproche du but la, j'arrive a afficher les informations dans les span, après quelques secondes (prévues par le settimeout) je vois qu'il y a bien l'appel de ma fonction d'affichage, seulement, la flash suivante n'est pas affiché et j’obtiens [object HTMLDivElement] dans un alert(flash), comme ci mes flash étaient transformé lors de l'appel de la fonction

    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
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    <script type="text/javascript" charset="UTF-8">
       var idEnCours = 0;
        var idMax = 0;
     
        function getRequeteHttp(){
     
            var xhr=null;
            if (window.XMLHttpRequest){ //navigateurs non MS
                xhr=new XMLHttpRequest();
            }
            else
                if (window.ActiveXObject){ //versions de MS IE
                    xhr=new ActiveXObject("Microsoft.XMLHTTP");
                }
            else {
                alert("navigateur non comptatible Ajax...");
            }
            return xhr;
        }
     
     
        function getFlash(){
            var xhr = getRequeteHttp();
     
            xhr.open("POST", "vues/v_chercherFlash.php", true);
            xhr.onreadystatechange = function(){
                recevoirReponse(xhr);
            }
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
            xhr.send(null);
        }
     
        function recevoirReponse(xhr){
     
            if (xhr.readyState == 4 && xhr.status==200) {
                var flash=xhr.responseText;
                var ttl = flash.split("##");
                idMax = ttl.length-1;
                changeMessage(ttl); //setinterval
     
            }
        }
     
     
     
    function changeMessage(flash){
    alert(flash);
        texte=flash[idEnCours].split('/');
     
       document.getElementById("libelle").innerHTML=texte[0];
       document.getElementById("Contenu").innerHTML=texte[1];
       document.getElementById("dateD").innerHTML=texte[2];
       document.getElementById("dateF").innerHTML=texte[3];
       if(idEnCours == idMax-1)
       {
           idEnCours = 0;
       }
       else
       {
          idEnCours++;
       }
       alert(flash);
       setTimeout('changeMessage(flash)','3000');
     }
    </script>

  20. #20
    Invité de passage
    Homme Profil pro
    Étudiant
    Inscrit en
    janvier 2013
    Messages
    14
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2013
    Messages : 14
    Points : 0
    Points
    0

    Par défaut

    Le script fonctionne ! Je vous remercie tous pour votre aide importante.

    Je fourni la fonction dans le cas où ça intéresserai quelqu'un plus tard :

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    function changeMessage(flash){
     
        texte=flash[idEnCours].split('/');
     
       document.getElementById("libelle").innerHTML=texte[0];
       document.getElementById("Contenu").innerHTML=texte[1];
       document.getElementById("dateD").innerHTML=texte[2];
       document.getElementById("dateF").innerHTML=texte[3];
       if(idEnCours == idMax-1)
       {
           idEnCours = 0;
       }
       else
       {
          idEnCours++;
       }
       setTimeout(function(){changeMessage(flash)},'5000');
     }

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

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •