Countdown js con variabile in php

  • Creatore Discussione Creatore Discussione alex.g
  • Data di inizio Data di inizio
A

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.
 
Ciao, puoi fare cosi:
PHP: 
dateFuture1 = new Date(<?php echo $fine;?>);
naturalmente la pagina deve avere estensione php
 
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:
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;?>');
 
criric ha scritto:
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;?>');
Clicca per allargare...





ok il concetto l'ho capito.
ma esattamente quali sono le righe da sostituire del codice ?
 
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
 
criric ha scritto:
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
Clicca per allargare...



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:
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
 
criric ha scritto:
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
Clicca per allargare...




Chiarissimo, grazie mille.
 
non 7 completi ma
6 giorni completi (24 ore) + 13 ore, 54 minuti, 4 secondi
 
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 ?
 
Non ho safari per provare, sicuro di aver abilitato javascript ?
aggiorno le date nel link perchè ormai sono scadute
 
criric ha scritto:
Non ho safari per provare, sicuro di aver abilitato javascript ?
aggiorno le date nel link perchè ormai sono scadute
Clicca per allargare...

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 ! !
 
Mistero.
prova a mettere var davanti a tutte le variabili
 
Devi accedere o registrarti per poter rispondere.

Discussioni simili

L
Creare un countdown con giorno specifico della settimana
Risposte
3
Visite
2K
PHP
Tommy03
Tommy03
T
countdown da sistemare con i CSS...
Risposte
4
Visite
1K
HTML e CSS
theseo
T
A
countdown modificabile con un click
Risposte
1
Visite
3K
Javascript
Longo8
Longo8
P
problema con il countdown per la fine dell'anno e per natale
Risposte
13
Visite
3K
Javascript
paperinik4
P
N
Countdown con effetto sonoro
Risposte
0
Visite
3K
Snippet Javascript
Nefyt
N
S
Fare un Countdown con flash
Risposte
0
Visite
2K
Flash
shane.west
S
L
Countdown con script
Risposte
4
Visite
2K
Javascript
leon-kennedy
L
A
Limite minimo con countdown textarea
Risposte
0
Visite
1K
Javascript
_Alexander_
A
M
Piccola intro con countdown!!!
Risposte
1
Visite
1K
Presenta il tuo Sito
antalive
A
L
  • Bloccata
countdown multiplo javascript
Risposte
1
Visite
963
Javascript
Max 1
Max 1
M
Come fare un countdown in HTML?
Risposte
4
Visite
4K
HTML e CSS
maxbossi
maxbossi
C
Countdown bloccato? Javascript?
Risposte
0
Visite
1K
Javascript
checcot
C
D
[Javascript] [HTML] Countdown su Mobirise di 24 ore relative per ogni utente.
Risposte
4
Visite
2K
Javascript
drago_it
D
Alex1990000
[PHP] countdown 6 ore data
Risposte
9
Visite
2K
PHP
Alex1990000
Alex1990000
Michaelweb93
[PHP] Creazione countdown a 72 ore
Risposte
1
Visite
1K
PHP
bubino8
bubino8
G
Countdown in secondi JS su pagina PHP
Risposte
1
Visite
2K
Javascript
geko66
G
N
Creazione countdown
Risposte
4
Visite
2K
PHP
newOne
N
O
Countdown jQuery
Risposte
0
Visite
1K
jQuery
owerpowa
O
O
Countdown jQuery
Risposte
1
Visite
4K
Javascript
Longo8
Longo8
P
countdown jquery
Risposte
2
Visite
1K
jQuery
processore
P
Alto Basso