Aller au contenu

Compte à rebours dybamique


orokham

Sujets conseillés

Bonjour,

Débutant en php, j'ai quelques problèmes avec l'intégration de script Js.

Je dois insérer dans un tableau php/xhtml (lecture du fetch mysql) à la fin de chaque ligne un compte à rebours (hh:mm:ss) en js.

J'ai trouvé un script moyen sur le net mais n'arrive pas à l'adapter pour que chaque ligne de mon tableau ai son compteur en fonctionnement.

Pouvez vous m'aiguiller dans mes recherches ?

Cordialement.

Merci.

Lien vers le commentaire
Partager sur d’autres sites

Alors voila mon code php (dans lequel il y à l'appel au script) :

		echo '<form>';
// récupération du résultat dans un tableau
echo '<br><br>';
echo '<table>';
echo '<tr>';
echo '<td colspan="8" color="red"><center>GUERRE : '.$nom_guerre.'</center></td>';
echo '</tr>';
echo '<tr>';
echo '<td><div class="liste_flotte">pseudo</div></td>';
echo '<td><div class="liste_flotte">nom flotte</div></td>';
echo '<td><div class="liste_flotte">date flotte</div></td>';
echo '<td><div class="liste_flotte">signature</div></td>';
echo '<td><div class="liste_flotte">temps de trajet</div></td>';
echo '<td><div class="liste_flotte">heure départ flotte</div></td>';
echo '</tr>';
while ($data = mysql_fetch_array($reponse)) {
echo '<tr>';
echo '<td><div class="liste_flotte">'.$data['pseudo'].'</div></td>';
echo '<td><div class="liste_flotte">'.$data['nom_flotte'].'</div></td>';
echo '<td><div class="liste_flotte">'.$data['d_f_jour'].'/'.$data['d_f_mois'].'/'.$data['d_f_année'].'</div></td>';
echo '<td><div class="liste_flotte">'.$data['sign_flotte'].'</div></td>';
echo '<td><div class="liste_flotte">'.$data['temps_trajet_hh'].'h'.$data['temps_trajet_mm'].'mn'.$data['temps_trajet_ss'].'s</div></td>';
echo '<td><div class="liste_flotte">'.temps_impact($data['temps_trajet_hh'],$data['temps_trajet_mm'],$data['temps_trajet_ss']).'</div></td>';
echo '<td><div class="liste_flotte"><script>.disp_delai().</script></div></td>';
echo '<input type="hidden">';
echo '</tr>';
}
echo '</table>';
echo '</form>';

// Libération des résultats
mysql_free_result($reponse);

// Fermeture de la connexion
mysql_close($base_dd);

et voila le code JS que j'ai trouvé (je ne comprend pas tout, alors ce code marche bien tout seul mais pas dans ma boucle)

D'ailleur ce code indique les années, moi et jour dont je nais pas besoin. Il me faut juste hh:mn:ss et répétable dans un tableau :

	<script LANGUAGE="Javascript">
function disp_delai(){
document.forms[0].elements[0].value=delai (2010,4,26,14,50);
setTimeout("disp_delai()",1000);
}

function delai(annee,mois,jour,heure,min)
{
var date_fin=new Date(annee,mois-1,jour,heure,min)
var date_jour=new Date();
var tps=(date_fin.getTime()-date_jour.getTime())/1000;
var j=Math.floor(tps/3600/24); // récupere le nb de jour
tps=tps % (3600*24);
var h=Math.floor(tps / 3600); // recupère le nb d'heure
tps=tps % 3600;
var m=Math.floor(tps/60); // récupère le nb minute
tps=tps % 60
var s=Math.floor(tps);

//var txt=j+" j "+h+" h "+m+" min"+s+" sec";
var txt=+h+"h "+m+"mn "+s+"s";
date_fin=don_date(date_fin);
return txt;
}

function don_date_jour()
{var date_jour=new Date();
date_jour=don_date(date_jour);
return date_jour;}

function don_date(une_date)
{var la_date;
var months=new Array(12);
months[1]="Janvier";
months[2]="Février";
months[3]="Mars";
months[4]="Avril";
months[5]="Mai";
months[6]="Juin";
months[7]="Juillet";
months[8]="Aout";
months[9]="Septembre";
months[10]="Octobre";
months[11]="Novembre";
months[12]="Décembre";

var days=new Array(7);
days[1]="Lundi";
days[2]="Mardi";
days[3]="Mercredi";
days[4]="Jeudi";
days[5]="Vendredi";
days[6]="Samedi";
days[7]="Dimanche";

var month=months[une_date.getMonth() + 1];
var day=days[une_date.getDay()];
var date=une_date.getDate();
var year=une_date.getYear();
}

</SCRIPT>

<html>
<!-- <body onload="disp_delai()"> -->
<form>
<br>
<form method=get action="">
<input size=25 maxlength=25>
<script>disp_delai();</script>
</form>
</body>
</html>

Modifié par Dadou
C'est mieux avec la balise code plutôt que cite non??
Lien vers le commentaire
Partager sur d’autres sites

Oups .. que de manip !

Bon je vais mettre ton message devant l'écran, potasser et tenter de faire ce que tu me dit.

Merci bien pour ta réponse (et peut être à plus tard si je sèche trop)

Lien vers le commentaire
Partager sur d’autres sites

Super !!!

Mais il y souvent un "mais" .. le script démarre bien avec les param de l'input mais dès que le setimeout passe mes param sont ignorés.

J'ai appliqué les param juste au 1er disp_delai

<script LANGUAGE="JavaScript">
function disp_delai_1(hh,mm){
document.getElementById('test1').value=delai (2010,4,27,hh,mm);
setTimeout("disp_delai_1()",1000);
}

function disp_delai_2(){
document.getElementById('test2').value=delai (2010,4,27,18,00);
setTimeout("disp_delai_2()",1000);
}

function delai(annee,mois,jour,heure,min)
{
var date_fin=new Date(annee,mois-1,jour,heure,min)
var date_jour=new Date();
var tps=(date_fin.getTime()-date_jour.getTime())/1000;
var j=Math.floor(tps/3600/24); // récupere le nb de jour
tps=tps % (3600*24);
var h=Math.floor(tps / 3600); // recupère le nb d'heure
tps=tps % 3600;
var m=Math.floor(tps/60); // récupère le nb minute
tps=tps % 60
var s=Math.floor(tps);

var txt=+h+"h "+m+"mn "+s+"s";
return txt;
}
</SCRIPT>

<html>
<body>
<form>
<table>
<tr>
<td><input id="test1"><script>disp_delai_1(10,10)</script></td>
</tr>
<tr>
<td><input id="test2"><script>disp_delai_2()</script></td>
</tr>
</table>
</form>
</body>
</html>

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...