11484 sujets

JavaScript, DOM et API Web HTML5

Rafraîchir un onglet géré par bootstrap

Bonjour,


je cherche a rafraîchir toute les X secondes un onglet actif.
Pour l'instant je tente de simuler un click sur le bouton caché via CSS mais cela ne fonctionne pas du tout. et j'avoue que tout ce que je trouve sur le net ne m'aide pas vraiment .


voici le code qui gère mes onglets:

// fonction qui gére les onglets
    $('a[href]')
    .click(function (e) {
      e.preventDefault();
      $(this).tab('show');
    })
    .on('shown.bs.tab', function (e) {
      $('#actif span').html($(e.target).text());
      $('#precedent span').html($(e.relatedTarget).text());
      if ('a href=\"#gef\"'){
        // document.getElementById(oublieGEF2).style.display = "none"
        raffraichir();
        //document.getElementById('oublieGEF2').click();
        
      }
    })


et voici ce que je tente de faire avec :


     $('#oublieGEF').click();
    $("#oublieGEF").submit(function(e){
      var montableau1="";
      var montableau2="";
      raffraichir();
      e.preventDefault();
      var postdata = $('#oublieGEF').serialize();
      // alert(postdata);
      // création de la partie ajax
      // cette partie permet de soumettre la recherche sans recharger la page.
      $.ajax({
        type: 'POST',
        // url qui contient le PHP destinataire ( attention au MVC !!!)
        url : 'objectifGEF.php',
        // variable  javascript à transmettr
        data: postdata,
        //type de variable  ici en mode json
        dataType:'json',
        // si succés alors executé la fonction suivante
        success: function(result){
         // en cas de succes de la requete executer par php qui est récuperé depuis le JSON
          if(result.succes.isSucces){
            console.log(result)
            var truc = result.data1; 
            var longtruc= result.data1.length;
             var truc2 = result.data2;
             var longtruc2= result.data2.length;
             console.log(result.succes)
             for (i=0;i<longtruc;i++){
              //  petit bout de code pour avoir une ligne sur  deux d'une couleur ( voir le CSS).
                var mod = i % 2;
                montableau1 += ('<tr class="row'+mod+'"><td>' +truc[i].numcmd+'</td></tr>');
               //  totalHT=totalHT+parsefloat(truc[i].montantHT)
                
             }
             for (i=0;i<longtruc2;i++){
               //  petit bout de code pour avoir une ligne sur  deux d'une couleur ( voir le CSS).
               var mod = i % 2;
              montableau2 += ('<tr class="row'+mod+'"><td>' +truc2[i].numrec+"</td></tr>");
             //  totalHT=totalHT+parsefloat(truc[i].montantHT)
              
           }    
           console.log(montableau1);
           console.log(montableau2);       
            $("#messageErreur").html("");
            $("#tableauListeCommandesManquantes").html("<thead><tr><th class=\"header\">Listes des commandes manquantes</th></tr></thead><tbody>"+montableau1+"</tbody>");            
            $("#tableauListeReceptionsManquantes").html("<thead><tr><th class=\"header\">Listes des receptions manquantes</th></tr></thead><tbody>"+montableau2+"</tbody>");            
            
          }else{
            console.log(result)
            var erreur= result.succes;
            console.log(erreur);
            
            $("#messageErreur").html("<span id=\"clignote\" style=\"color:red\"><p>Une erreur est survenue lors de la requete PHP.<br> Voici la raison : "+erreur.messageError+"</p></span><br>");
          }
          postdata="";
        },
        error: function(result){
          // console.log(result)
          var erreur= result.responseText;
          console.log(erreur);
          $("#tableauListSortie").html("");
          $("#messageErreur").html("<span id=\"clignote\" style=\"color:red\"><p>Erreur rencontré ! "+erreur+"</p></span><br>");
          //alert( result['codePharma'] );
          //alerte(postdata);
          postdata="";
        }
        
      });

la fonction "raffraichir" 

function raffraichir() 
  { 
  var nbreMillisec = 300000; 
  setTimeout("raffraichir();", nbreMillisec); 
  }


Merci par avance a ceux qui pourrons éclairer ma lanterne ( qui n'est pas magique Smiley biggol )
Modifié par palouf34 (16 Oct 2017 - 13:55)
Bonjour,
je n'ai pas lu tout ton code, mais si tu veux que ta fonction soit appelée toutes les 300000 ms, c'est setInterval() et pas setTimeout().
merci pour la subtilité qui me sera bien utile lorsque j'aurais réussis lancer le premier déclenchement lors de la sélection de mon onglet.
la je ne vois pas ou je peux activé le trigger.

c'est un "truc" que je découvre et ne comprends pas du tout comment l'implémenter.
je n'avance pas sur mon problème.

je pense que prendre le problème à l'envers... et cela m'agace bien de ne pas avancer sur la solution à mon histoire de rafraîchir automatiquement mon onglet affiché...

Pensez vous que créer un evenements sur le chargement de l'onglet pourrais m'aider à faire ce que je souhaites??
Sujet clos
Aller à