Je vais essayé d'être clair...
Je souhaite insérer un compte à rebours indépendant pour chaque annonce dans une boucle.
Actuellement, le compteur s'affiche avec le même temps pour toutes les annonces.
Je suppose qu'il faut que j'incrémente l'id d'une div afin qu'elles soient indépendantes les unes des autres.
Merci d'avance à vous
Le site: https://encheres24.ch
function in_progress_auction_card_func() {
/* Récupération des annonces demarrées*/
$args = array
(
'post_type' => 'vehica_car',
'posts_per_page' => -1,
'cache_results' => false,
'update_post_meta_cache' => false,
'update_post_term_cache' => false,
'tax_query' => array(
array (
'taxonomy' => 'vehica_19636',
'field' => 'slug',
'terms' => array( 'voitures', 'motocycles', 'vehicules-utilitaires', 'autres-annonces'),
)
),
'meta_query' => array(
array(
'key' => 'auction_status',
'value' => 'demarrer',
'compare' => 'IN',
),
),
);
$in_progress_query = new WP_Query( $args );
$annonces_en_cours = $in_progress_query->posts;
ob_start();
foreach($annonces_en_cours as $annonce)
{
// Info date
date_default_timezone_set('Europe/Paris');
$start_date_auction = get_post_meta($annonce->ID, 'vehica_20836', true);
$start_hour_auction = get_post_meta($annonce->ID, 'vehica_20856', true);
$start_date_hour_auction = $start_date_auction . ' ' . $start_hour_auction;
$end_date_auction_str = strtotime($start_date_hour_auction . '+ 1 days');
$end_date_auction = date('d.m.Y H:i:s', $end_date_auction_str);
$now = date('j.m.Y H:i:s');
} ?>
<script>
<?php
$dateTime = strtotime($end_date_auction);
$getDateTime = date("F d, Y H:i:s", $dateTime);
?>
var countDownDate = new Date("<?php echo "$getDateTime"; ?>").getTime();
// Update the count down every 1 second
var x = setInterval(function() {
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Output the result in an element with id="counter"11
if(distance > 0)
{
$('.afs_card_cardcounter').html(
"<div class='afs_counter_card_number'>" +
"<li>" + "<i class='fas fa-clock'></i> " + "</li>" +
"<li>" + hours + "<span>" + " H" + "</span>" + "</li>" +
"<li>" + minutes + "<span>" + " Min " + "</span>" + "</li>" +
"<li>" + seconds + "<span>" + " Sec " + "</span>" + "</li>" +
"</div>");
}
else
{
$('.afs_card_cardcounter').html(
"<div class='afs_counter_card_number'>" +
"<li class='afs_counter_ended'>" + "<i class='fas fa-clock'></i> " + "Enchère terminée" + "</li>" +
"</div>"
);
}
}, 1000);
</script>
<?php
echo '<div class="afs_card_cardcounter afs_card_cardcounter_in_progress_counter_background"></div>';
return ob_get_clean();
}