Bonjour,

Je rencontre un petit soucis.

Je souhaite pouvoir incrémenter une div dans une boucle, afin que chaque compteur soit indépendant les uns des autres. (car les annonce auront des dates de départ différentes).

Actuellement, j'incrémente, mais toutes les div ont quand même le même numèro d'incrémentation....

Le site: encheres24.ch


Je vous remercie d'avance pour votre aide....

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
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(); 
 
        $id_annonce = 1;
 
        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');        
 
            $id_annonce++;
 
        } ?>
 
        <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
            x = [];
            x[<?= $id_annonce ?>] =  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(
                    "<ul 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>" +
                    "</ul>");     
                }
                else
                {
                    $('.afs_card_cardcounter').html(
                    "<ul class='afs_counter_card_number'>" +
                        "<li class='afs_counter_ended'>" + "<i class='fas fa-clock'></i> " + "Enchère terminée" + "</li>" +
                    "</ul>"
                    );
                }                   
            }, 1000);
        </script>
 
        <?php
 
        echo '<div id="afs_counter_' . $id_annonce . '" class="afs_card_cardcounter afs_card_cardcounter_in_progress_counter_background"></div>';        
 
    return ob_get_clean();    
 
}