Countdown js con variabile in php

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Ciao a tutti.
Mi trovo con un semplice problema.
Ho trovato e personalizzato il seguente codice js per realizzare un conto alla rovescia da inserire sul mio sito.
dovrei però sostituire:

dateFuture1 = new Date(2014,04,16,01,01,01);

con la mia variabile php che contiene la mia data di fine del contdown che è in php

$fine.

La mia domanda è come faccio con js( che non conosco ) a dirgli che dateFuture1 deve essere = a $fine ?
grazie mille.
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, puoi fare cosi:
PHP:
dateFuture1 = new Date(<?php echo $fine;?>);
naturalmente la pagina deve avere estensione php
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Grazie per la risposta, effettivamente non avevo pensato di aprire un tag php e dichiarare la variabile.
Ne approfitto della vostra disponibilità e professionalità per estendere il problema che mi si è generato una volta risolto quest'ultimo.

Questo script Js che crea un countdown tenendo come data di fine una variabile php, è inserito in un ciclo for.
Questo ciclo genera delle tabelle ed in ognuna di queste speravo che il countdown potesse tenere in considerazione la variabile $fine che il ciclo php generava con date diverse prelavando valori dalla tabella mysql. Invece il countdown viene visualizzato solo sulla prima tabella e sulle altre no.

Chiaramente di seguito posto la pagina php completa contenente il ciclo for e lo script js.
grazie per l'aiuto.
PHP:
<form id="form2" name="form2" method="post" action="i-prodotti.php">
  <p align="left">

    <?php
//echo"<hr /><br>";
	 
$cat=$_GET['cat'];
$id_prodotto=$_GET['id_prodotto'];


//TROVO IL NOME DELLA CATEGORIA
	  	  	  $query = "SELECT * FROM ...    ";
			  //echo $query;
              $result = mysql_query($query) or die(mysql_error());
              $numrows = mysql_num_rows($result);
			  $resrow = mysql_fetch_array($result);
			  $nome_cate=$resrow['nome'];
			  
echo"Stai visualizzando la categoria $nome_cate"."<br><br>";			  

    $pag = $_GET["pag"];
    if (isset($pag) == false || is_numeric($pag) == false || $pag < 1)
    {
        $pag = 1;
    }

    $fine = 6;
    $inizio = ($pag - 1) * $fine;

		 
			 
    $sql = "SELECT * FROM ... LIMIT " . $inizio . ", " . $fine;

    $query = mysql_query($sql, $cn); 
	
	// TABELLA SINGOLA GENERALE GRANDE
?>
<table align="center"  border="0" cellpadding="7" cellspacing="0" bordercolor="#000000"><tr>
<?php



            $lista = mysql_num_rows($query);  
            $index = 0; 
             
            for ($a = 0; $a < $lista; $a++)  
            {  
                $resrow = mysql_fetch_array($query);  
				
$cliente=$resrow['cliente'];
$ragione_sociale=$resrow['ragione_sociale'];
$uploadfile=$resrow['foto_1'];
$titolo=$resrow['titolo'];

$prezzo_up=$resrow['prezzo_up'];
$prezzo=$resrow['prezzo'];
$fine=$resrow['fine'];

//SCOMPONGO LA DATA E L'ORA PER IL CONTEGGIO DEL TIMER togliendo '1' al mese perchè il mese in conteggio parte da zero.


$anno = substr($fine, 0, 4);   
$mese = substr($fine, 5, 2)-1;  
$giorno = substr($fine, 8, 2);  

//echo $anno."<br>";
//echo $mese."<br>";
//echo $giorno."<br>";

$index++; 
 
?>

         <!-- TIMER DATE -->
                 
<script type="text/javascript">

dateFuture1 = new Date(<?php echo "$anno,$mese,$giorno,00,00,00";?>);


function GetCount(ddate,iid){

	dateNow = new Date();	//grab current date
	amount = ddate.getTime() - dateNow.getTime();	//calc milliseconds between dates
	delete dateNow;

	// if time is already past
	if(amount < 0){
		document.getElementById(iid).innerHTML="SCADUTO !";
	}
	// else date is still good
	else{
		weeks=0;days=0;hours=0;mins=0;secs=0;out="";

		amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

		weeks=Math.floor(amount/604800);//weeks
		amount=amount%604800;

		days=Math.floor(amount/86400);//days
		amount=amount%86400;

		hours=Math.floor(amount/3600);//hours
		amount=amount%3600;

		mins=Math.floor(amount/60);//minutes
		amount=amount%60;

		secs=Math.floor(amount);//seconds

		if(weeks != 0){out += weeks +" "+((weeks==1)?"settimana":"settimane")+", ";}
		if(days != 0){out += days +" "+((days==1)?"giorno":"giorni")+", ";}
		if(hours != 0){out += hours +" "+((hours==1)?"ora":"ore")+", ";}
		out += mins +" "+((mins==1)?"minuto":"minuti")+", ";
		out += secs +" "+((secs==1)?"secondo":"secondi")+", ";
		out = out.substr(0,out.length-2);
		document.getElementById(iid).innerHTML=out;

		setTimeout(function(){GetCount(ddate,iid)}, 1000);
	}
}

window.onload=function(){
	GetCount(dateFuture1, 'countbox1');
	//you can add additional countdowns here (just make sure you create dateFuture2 and countbox2 etc for each)
};
</script>





</span></span><script type="text/javascript">

var stile = "top=10, left=120, width=1000, height=800, status=no, menubar=no, toolbar=no scrollbars=yes";
function Popup(apri)
{
window.open(apri, "", stile);
}

  </script>
 

<!-- tabella primaria attorno al rettagolo -->
<td><table border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" >
<!--TABELLA SINGOLO ESTERNO PRIMARIO -->				
<td width="437" height="399" align="center" valign="top"><p><img src="upload_foto/immagini/<?php echo"$uploadfile"; ?>" alt="" width="428" height="318" class="Stile_tabella" align="center" border="5" bordercolor="#FFFFFF"  cellpadding="0" cellspacing=""></p>
    <table width="437" height="168" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="10" height="21" >&nbsp;</td>
        <td colspan="4" ><span class="Titolo_tabella"><?php echo $titolo; ?></span></td>
        <td width="11" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td width="131" height="21" >&nbsp;</td>
        <td width="107" height="21" >&nbsp;</td>
        <td width="14" height="21" >&nbsp;</td>
        <td width="165" height="21" >&nbsp;</td>
        <td width="11" height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td width="10" height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td rowspan="2" bgcolor="#0066CC" class="Prezzo_tabella">&nbsp;</td>
        <td rowspan="2" bgcolor="#0066CC" class="Prezzo_tabella"><?php echo "&euro; ".$prezzo; ?></td>
        <td height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td height="0" ><span class="Timer_tabella"></span>
          
        </td>
        <td height="0" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td height="21" colspan="2" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
        <td height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td height="21" colspan="4" bgcolor="#FF0000" >
        
        
        <div class="Timer_tabella" align="center" id="countbox1"></div>
        
        
        
       
        
        
        
        
        
        </td>
        <td height="21" >&nbsp;</td>
      </tr>
      <tr>
        <td height="21" >&nbsp;</td>
        <td height="21" colspan="4" >
          

          </td>
        <td height="21" >&nbsp;</td>
      </tr>
    </table></td></table>
  </td>

  </p>
  <?php



        if($index == 2){ 
        echo"</tr><tr>"; $index = 0;

        } 

            } 
echo "</tr></table>"; 
        mysql_close(); 

 

?>
  <p align="center">&nbsp;</p>



  <div align="left"><span>
    <?php

 $query = mysql_query("SELECT * FROM ... ", $cn);
    $quanti = mysql_num_rows($query);

    @$intero = $quanti / $fine;
?>
    </span>  </div>
  <p align="left" >
<?php
 for($x=1; $x<$intero+1; $x++)
    {
        if ($x == $pag)
        {
?>

<b><? echo $x;?></b> |

<?
        }
        else
        {
?>

<a href="visit_1_bis.php?pag=<?echo $x;?>&cat=<?echo $cat;?>"><?echo $x;?></a> |

<?
        }
    }
echo"<br>";
if($lista==0){ echo "Nessun prodotto inserito in questa categoria";}
?>
  <?php
    mysql_close($cn);
?>
</form>
 
Ultima modifica di un moderatore:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Devi rendere dinamico anche l'id dei box altrimenti vedrai sempre l'effetto solo sul primo
sia quando lo crei
PHP:
id="countbox<?php  echo $a;?>">
che quando lo richiami
PHP:
GetCount(dateFuture1, 'countbox<?php  echo $a;?>');
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Devi rendere dinamico anche l'id dei box altrimenti vedrai sempre l'effetto solo sul primo
sia quando lo crei
PHP:
id="countbox<?php  echo $a;?>">
che quando lo richiami
PHP:
GetCount(dateFuture1, 'countbox<?php  echo $a;?>');





ok il concetto l'ho capito.
ma esattamente quali sono le righe da sostituire del codice ?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Le righe sono quelle 2 che ti ho indicato
Codice:
 GetCount(dateFuture1, 'countbox1');
HTML:
<div class="Timer_tabella" align="center" id="countbox1"></div>
ma non mi piace molto come soluzione, provo a crearti un alternativa
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Le righe sono quelle 2 che ti ho indicato
Codice:
 GetCount(dateFuture1, 'countbox1');
HTML:
<div class="Timer_tabella" align="center" id="countbox1"></div>
ma non mi piace molto come soluzione, provo a crearti un alternativa



Grazie mille, anche perchè con questa soluzione il countdown sparisce completamente.
Anzi dimenticavo di dirti che lo scritp js è stato tolto dal ciclo for lasciandolo subito prima, in modo da non appesantire la pagine.
Le ho provate davvero tutte me non mi viene in mente altro..
Qualche idea ? ?
 
Ultima modifica:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Potresti provare cosi
PHP:
<script type="text/javascript">
    
    function GetCount(data,id){
        
        data = new Date(data);
        dateNow = new Date();    //grab current date
        amount = data.getTime() - dateNow.getTime();    //calc milliseconds between dates
        delete dateNow;

        // if time is already past
        if(amount < 0){
            document.getElementById(id).innerHTML="SCADUTO !";
        } else {
            weeks=0;days=0;hours=0;mins=0;secs=0;out="";

            amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

            weeks=Math.floor(amount/604800);//weeks
            amount=amount%604800;

            days=Math.floor(amount/86400);//days
            amount=amount%86400;

            hours=Math.floor(amount/3600);//hours
            amount=amount%3600;

            mins=Math.floor(amount/60);//minutes
            amount=amount%60;

            secs=Math.floor(amount);//seconds

            if(weeks != 0){out += weeks +" "+((weeks==1)?"settimana":"settimane")+", ";}
            if(days != 0){out += days +" "+((days==1)?"giorno":"giorni")+", ";}
            if(hours != 0){out += hours +" "+((hours==1)?"ora":"ore")+", ";}
            out += mins +" "+((mins==1)?"minuto":"minuti")+", ";
            out += secs +" "+((secs==1)?"secondo":"secondi")+", ";
            out = out.substr(0,out.length-2);
            //            alert(id);
            document.getElementById(id).innerHTML=out;

            setTimeout(function(){GetCount(data,id)}, 1000);
        }
        
    }
    window.onload = function() {
        var f = document.getElementsByClassName("fine");
        for (var i =0; i < f.length; i++) {
            GetCount(f[i].innerHTML,"f" + i);
        } 
    }
</script> 
<style>
    table td {
        border:1px solid black;
        padding:6px;
    }
</style>
<table>
    <tr>
        <th>Nome</th>
        <th>Scadenza</th>
    </tr>
    <?php
    $rows = array(
        0 => array(
            "nome" => "prima riga",
            "fine" => "2014-05-30"
        ),
        1 => array(
            "nome" => "seconda riga",
            "fine" => "2014-05-28"
        ),
        2 => array(
            "nome" => "terza riga",
            "fine" => "2014-05-22"
        )
    );
    foreach ($rows as $k => $row) {
        echo "<tr>";
        echo "<td>" . $row["nome"] . "</td>";
        echo "<td><span id='f$k' class='fine'>" . $row["fine"] . "</span></td>";
        echo "</tr>";
    }
    ?>
</table>
ho usato un array al posto della query, l'idea si dovrebbe comunque capire
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Potresti provare cosi
PHP:
<script type="text/javascript">
    
    function GetCount(data,id){
        
        data = new Date(data);
        dateNow = new Date();    //grab current date
        amount = data.getTime() - dateNow.getTime();    //calc milliseconds between dates
        delete dateNow;

        // if time is already past
        if(amount < 0){
            document.getElementById(id).innerHTML="SCADUTO !";
        } else {
            weeks=0;days=0;hours=0;mins=0;secs=0;out="";

            amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

            weeks=Math.floor(amount/604800);//weeks
            amount=amount%604800;

            days=Math.floor(amount/86400);//days
            amount=amount%86400;

            hours=Math.floor(amount/3600);//hours
            amount=amount%3600;

            mins=Math.floor(amount/60);//minutes
            amount=amount%60;

            secs=Math.floor(amount);//seconds

            if(weeks != 0){out += weeks +" "+((weeks==1)?"settimana":"settimane")+", ";}
            if(days != 0){out += days +" "+((days==1)?"giorno":"giorni")+", ";}
            if(hours != 0){out += hours +" "+((hours==1)?"ora":"ore")+", ";}
            out += mins +" "+((mins==1)?"minuto":"minuti")+", ";
            out += secs +" "+((secs==1)?"secondo":"secondi")+", ";
            out = out.substr(0,out.length-2);
            //            alert(id);
            document.getElementById(id).innerHTML=out;

            setTimeout(function(){GetCount(data,id)}, 1000);
        }
        
    }
    window.onload = function() {
        var f = document.getElementsByClassName("fine");
        for (var i =0; i < f.length; i++) {
            GetCount(f[i].innerHTML,"f" + i);
        } 
    }
</script> 
<style>
    table td {
        border:1px solid black;
        padding:6px;
    }
</style>
<table>
    <tr>
        <th>Nome</th>
        <th>Scadenza</th>
    </tr>
    <?php
    $rows = array(
        0 => array(
            "nome" => "prima riga",
            "fine" => "2014-05-30"
        ),
        1 => array(
            "nome" => "seconda riga",
            "fine" => "2014-05-28"
        ),
        2 => array(
            "nome" => "terza riga",
            "fine" => "2014-05-22"
        )
    );
    foreach ($rows as $k => $row) {
        echo "<tr>";
        echo "<td>" . $row["nome"] . "</td>";
        echo "<td><span id='f$k' class='fine'>" . $row["fine"] . "</span></td>";
        echo "</tr>";
    }
    ?>
</table>
ho usato un array al posto della query, l'idea si dovrebbe comunque capire




Chiarissimo, grazie mille.
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
A me sembra che il conteggio sia giusto, guarda qui
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
non 7 completi ma
6 giorni completi (24 ore) + 13 ore, 54 minuti, 4 secondi
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Ciao, mesi fa mi avevi suggerito uno script per il corretto funzionamento del conto alla rovescia in java.
Vedo ora che da Safari non funziona 'da pc', mentre da Tablet e Smartphone (safari) non ci sono problemi.
Link script qui.
Hai suggerimenti ?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Non ho safari per provare, sicuro di aver abilitato javascript ?
aggiorno le date nel link perchè ormai sono scadute
 

alex.g

Nuovo Utente
15 Mag 2014
13
0
1
Non ho safari per provare, sicuro di aver abilitato javascript ?
aggiorno le date nel link perchè ormai sono scadute

Si, Java su safari abilitato e ultima versione installata.
Da pc il conto alla rovescia non va, visualizza questo: (NaN settimane, NaN giorni, NaN ore, NaN minuti, NaN secondi). Mistero ! !
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Mistero.
prova a mettere var davanti a tutte le variabili
 
Discussioni simili
Autore Titolo Forum Risposte Data
L Creare un countdown con giorno specifico della settimana PHP 3
T countdown da sistemare con i CSS... HTML e CSS 4
A countdown modificabile con un click Javascript 1
P problema con il countdown per la fine dell'anno e per natale Javascript 13
N Countdown con effetto sonoro Snippet Javascript 0
S Fare un Countdown con flash Flash 0
L Countdown con script Javascript 4
A Limite minimo con countdown textarea Javascript 0
M Piccola intro con countdown!!! Presenta il tuo Sito 1
L countdown multiplo javascript Javascript 1
M Come fare un countdown in HTML? HTML e CSS 4
C Countdown bloccato? Javascript? Javascript 0
D [Javascript] [HTML] Countdown su Mobirise di 24 ore relative per ogni utente. Javascript 4
Alex1990000 [PHP] countdown 6 ore data PHP 9
Michaelweb93 [PHP] Creazione countdown a 72 ore PHP 1
G Countdown in secondi JS su pagina PHP Javascript 1
N Creazione countdown PHP 4
O Countdown jQuery jQuery 0
O Countdown jQuery Javascript 1
P countdown jquery jQuery 2
blips Countdown e Redirect Javascript 3
T Javascript e countdown multipli Javascript 1
T Countdown e timestamp PHP 0
S countdown in php e script per aprire 2 siti contemporanemante PHP 1
S countdown PHP 1
maxnegri Problema countdown Javascript 3
F Countdown / timer javascript Javascript 19
S Stampare un messaggio alla fine del countdown in Javascript Javascript 0
maxnegri Stampare un messaggio alla fine di un countdown in javascript Javascript 0
M Countdown in asp Classic ASP 0
E Domanda countdown PHP PHP 3
J Countdown Timer 2 Javascript 0
J Make a JavaScript Countdown Timer in OOP Javascript 0
J JavaScript Countdown Timer solution in OOP Javascript 0
T Countdown fra 2 date in ASP Classic ASP 12
M Differenza tra date e countdown PHP 5
J Top 10 Beautiful Christmas Countdown Timers Javascript 0
G Countdown per l'apertura di un sito Javascript 1
M Countdown script Javascript 1
M countdown Flash 0
M Countdown Server Side Classic ASP 0
C Conto alla rovescia - Countdown (al secondo) Javascript 1
G Countdown particolare Javascript 8
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
D Carousel bootstrap con video HTML e CSS 2
D Come estendere la tariffa per Wordpress con Visa? Hosting 1
T [VENDO] Guest Post su siti di Proprietà con IP diversi Offerte e Richieste di scambio links 0
A Somma di orari con centesimi PHP 1
T Query su due tabelle con totali Database 4

Discussioni simili