DIV refresh with index

Pass i to your function.

setInterval(loadLog("<?php echo $i; ?>"), 1000);

Select allOpen in new window

Great, already it displays the first data when loading the page, but does not refresh the div every 1 sec.
However, I had to move the <script> in the request loop before the $i++

In this case you just need to call again the timer at success event

Like this? (does not work)

<script>
function loadLog(i) {
    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      $("#promo_" + i).html(html);
      setInterval(loadLog('<?php echo $i; ?>'), 1000);
   }
    });
}
   setInterval(loadLog('<?php echo $i; ?>'), 1000);
</script>

Select allOpen in new window

Like this

success: function(html){
      $("#promo_" + i).html(html);
 setTimeout(loadLog(parseInt(i)+1), 1000);}

Select allOpen in new window

You may stop process the timer after total size>= i

No, once this line is added it no longer displays anything even at load

Use setTimeout, replace setInterval function.

I still can't...
It does not display anything even at load

<script>
function loadLog(i) {
    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      $("#promo_" + i).html(html);
       setTimeout(loadLog(parseInt(i)+1), 1000);}
   }
    });
}   
   setTimeout(loadLog('<?php echo $i; ?>'), 1000);
</script>

Select allOpen in new window

Your line of code 12 seems got extra close bracklet.

setTimeout(loadLog(parseInt(i)+1), 1000);

Select allOpen in new window

damn...i hadn't noticed, sorry.
It displays at load but still does not refresh.

Before you start calling this function, can I know what's the value return for i variable?

alert('<?php echo $i; ?>');
setTimeout(loadLog('<?php echo $i; ?>'), 1000);

Select allOpen in new window

I have 3 recordings, it shows me every second 1, 2 then 3
So it actually runs the loop, but doesn't refresh _promo.php?
That's right ?

Can you put a alert() in _promo.php page, see whether the page fire accordingly?

_promo.php
===========
<?php 

//add this line
echo "<script>alert('".$_POST["reference"]."');</script>";

if(isset($_POST["reference"])) {
...
}

?>

Select allOpen in new window

It displays the alerts one after another.
It does display the $reference
But don't refresh after the first second.

If I put html (aaa) then change it to bbb it doesn't update

Check whether the html response return correctly as well.

alert(html);
$("#promo_" + i).html(html);

Select allOpen in new window

It displays 3 alerts from my 3 recordings and stops

<script>
function loadLog(i) {
    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      alert(html);
      $("#promo_" + i).html(html);
      setTimeout(loadLog(parseInt(i)+1), 1000);
   }
    });
}   
   //alert('<?php echo $i; ?>');
   setTimeout(loadLog('<?php echo $i; ?>'), 1000);
</script>

<?php $i++;}

Select allOpen in new window

all results return correctly as what you expected? Only the results not display in "promo_INDEX" <div> control respectively, right?

So at load, everything is ok, except that the 1 sec loop does not respond. 

For first load, do you mean the 1 sec loop doesn't work although all the alert is displaying correctly?

here is a preview of my index.php page

I opted for the second option, that of putting the script out of loop.
It shows _propo.php content with this error in console.

You may revise this part to call off the timer if the last index meet.

      i=parseInt(i)+1;

      if(i<intTotal){
        setTimeout(loadLog(i), 1000);
      }

Select allOpen in new window

Otherwise, just put your script under try/catch() method.

function loadLog(i) {
  try{

    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      $("#promo_" + i).html(html);
       i=parseInt(i);
      if(i<intTotal){
        setTimeout(loadLog(i+1), 1000);
      }
     }
    });

  }catch(e){}
}   

Select allOpen in new window

I have no more errors, _promo.php is displayed without refreshing.

var intTotal=parseInt('<?php echo $i; ?>');//total index
function loadLog(i) {
    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      $("#promo_" + i).html(html);
 
      i=parseInt(i)+1;

      if(i<intTotal){
        setTimeout(loadLog(i), 1000);
      }
   }
    });
}   
   setTimeout(loadLog(0), 1000);//start with first ind

Select allOpen in new window

No errors and no preview of _promo.php

var intTotal=parseInt('<?php echo $i; ?>');//total index
function loadLog(i) {
  try{
    var reference    = document.getElementById("txt_reference_" + i).value;
    $.ajax({
    type: "POST",
    url: "_promo.php",
    cache: false,
    data: {reference: reference},
    error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
    success: function(html){
      $("#promo_" + i).html(html);
       i=parseInt(i);
      if(i<intTotal){
        setTimeout(loadLog(i+1), 1000);
      }
     }
    });


  }catch(e){}
}  

Select allOpen in new window

Enable back the alert(), check to ensure the timer active to call out the value correctly

Good. So the display correctly now. Can you give further information on this crashes issue?

The refresh on the other hand always crashes.

No, I meant by planting that it does not refresh. Sorry for the confusion.

Noted. Since the display data is return correctly, try this instead:

$("#promo_" + i).html(html);

change to

document.getElementById("promo_"+i).innerHTML=html;

Select allOpen in new window

Otherwise, you have to put your code under $(document).ready() method since you are using jquery to output the content.

$(document).ready(function(){ 

    function loadLog(i) {
        //your existing code...
    }

}); 

Select allOpen in new window

in both cases it displays without refreshing

$(document).ready(function(){ 
   function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');
      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){

$("#promo_" + i).html(html);

        i=parseInt(i)+1;
        if(i<intTotal){
         setTimeout(loadLog(i), 1000);
        }
      }
      });
   }   
   setTimeout(loadLog(0), 1000);
}); 

Select allOpen in new window

function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');
      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){

document.getElementById("promo_"+i).innerHTML=html;

        i=parseInt(i)+1;
        if(i<intTotal){
         setTimeout(loadLog(i), 1000);
        }
      }
      });
}  
   setTimeout(loadLog(0), 1000);

Select allOpen in new window

I didn't think the problem would be so complex to tell the truth.

in both cases it displays without refreshing 

In this case, try to refresh the div using timer as well to display the correct returned response.

setTimeout(function(){document.getElementById("promo_"+i).innerHTML=html;},100);

Select allOpen in new window

not yet 

   function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('2');
      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){

$("#promo_" + i).html(html);
//document.getElementById("promo_"+i).innerHTML=html;

        i=parseInt(i)+1;
        if(i<intTotal){
         //setTimeout(loadLog(i), 1000);
           setTimeout(function(){document.getElementById("promo_"+i).innerHTML=html;},100);
        }
      }
      });
   }   
   setTimeout(loadLog(0), 1000);

Select allOpen in new window

What's error there as highlighted? Try this ...

<script>
function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');

      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
        
        setTimeout(DisplayResponse("promo_"+i,html),100);

        i=parseInt(i)+1;
        if(i<intTotal){
         setTimeout(loadLog(i), 1000);
        }
      }
      });
   }      

function DisplayResponse(promo_ID,html){
  document.getElementById(promo_ID).innerHTML=html;
}

setTimeout(loadLog(0), 1000);


</script>

Select allOpen in new window

It does not display anything from the load.
This code displays but does not refresh

Have you put under $(document).ready() event?

<script>

$(document).ready(function(){ 

function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');

      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
        
        setTimeout(DisplayResponse("promo_"+i,html),100);

        i=parseInt(i)+1;
        if(i<intTotal){
         setTimeout(loadLog(i), 1000);
        }
      }
      });
   }      

function DisplayResponse(promo_ID,html){
  document.getElementById(promo_ID).innerHTML=html;
}

}); 

setTimeout(loadLog(0), 1000);


</script>

Select allOpen in new window

Yes yes,
I changed that to
});
setTimeout(loadLog(0), 1000);

that

setTimeout(loadLog(0), 1000);
});

same problem

This is very weird. The html response showing correctly should able to display the changed result in <DIV>.
Have you try to view the result again in Chrome incognito browser to view non-cached result?

Nothing works, I tried to simplify the code of my index page but still the same worries.

Here is my entire index.php page

<?php include($_SERVER["DOCUMENT_ROOT"]."/includes/header.php"); ?>

<?php
try {
        $stat = $pdo->query( "SELECT * FROM tab_shop_produits");
        $i = 0;
        while ($data = $stat->fetch( PDO::FETCH_ASSOC)) {
         $reference = $data["reference"];
?>

<div id="promo_<?php echo $i; ?>"></div>
<input type="hidden" id="txt_reference_<?php echo $i; ?>" value="<?php echo $reference; ?>">
<?php $i++;}} catch(PDOException $e){echo "<div class='alert alert-danger'>".$e->getMessage()."</div>";} ?>

<script>
$(document).ready(function(){ 

function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');

      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: false,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
        
        setTimeout(DisplayResponse("promo_"+i,html),100);

        i=parseInt(i)+1;
        if(i<intTotal){
         setTimeout(loadLog(i), 1000);
        }
      }
      });
   }      

function DisplayResponse(promo_ID,html){
  document.getElementById(promo_ID).innerHTML=html;
}

setTimeout(loadLog(0), 1000);
});
</script>

<?php include($_SERVER["DOCUMENT_ROOT"]."/includes/footer.php"); ?>

Select allOpen in new window

My entire _promo.php page

<?php
require_once($_SERVER['DOCUMENT_ROOT']."/includes/config.php");
if(isset($_POST["reference"])) {
   
$stat = $pdo->query( "SELECT fin_promo FROM tab_produits WHERE reference = '".$_POST["reference"]."' ");
        while ($pro = $stat->fetch( PDO::FETCH_ASSOC)) {
         $fin_promo    = $pro["fin_promo"];
         
if(!empty($fin_promo) AND $fin_promo > date("Y-m-d H:i:s")){
$date1       = strtotime("now"); 
$date2       = strtotime($fin_promo);
$diff       = abs($date2 - $date1);
$years       = floor($diff / (365*60*60*24));
$months    = floor(($diff - $years * 365*60*60*24) / (30*60*60*24));
$days       = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24)/ (60*60*24));
$hours       = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24) / (60*60)); 
$minutes    = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60)/ 60); 
$seconds    = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60 - $minutes*60)); 
   
if($months == 0) {$mois = null;}
if($months >= 1) {$mois = $mois." mois, ";}

if($days == 0) {$jour = null;}
if($days == 1) {$jour = $days." jour, ";}
if($days >= 2) {$jour = $days." jours, ";}

if($hours == 0) {$heure = null;}
if($hours == 1) {$heure = $hours." heure, ";}
if($hours >= 2) {$heure = $hours." heures, ";}
   
if($minutes == 0) {$minute = null;}
if($minutes == 1) {$minute = $minutes." minute";}
if($minutes >= 2) {$minute = $minutes." minutes";}
   
if($seconds == 0) {$seconde = null;}
if($seconds == 1) {$seconde = " et ".$seconds." seconde";}
if($seconds >= 2) {$seconde = " et ".$seconds." secondes";}

$promo = "<div id='promo' class='mb-2 text-end small text-success blink_'>La promo se termine dans ".$mois.$jour.$heure.$minute.$seconde."</div>";
   } else {
$promo = null;
}
      }
   echo $promo;
}
?>

Select allOpen in new window

My entire tab_shop_products table

CREATE TABLE `tab_shop_produits`  (
  `id` int NOT NULL AUTO_INCREMENT,
  `nic_handle` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `reference` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `personnalisation` text CHARACTER SET utf8 COLLATE utf8_general_ci NULL,
  `quantite` float NULL DEFAULT 0,
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = MyISAM AUTO_INCREMENT = 35621 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

INSERT INTO `tab_shop_produits` VALUES (1, 'JA90717', 'TC57', 'personnalisation', 1);
INSERT INTO `tab_shop_produits` VALUES (2, 'JA90717', 'TC30', '', 1);
INSERT INTO `tab_shop_produits` VALUES (3, 'JA90717', 'cheque-cadeau', NULL, 1);

Select allOpen in new window

I thought maybe testing on your side would help more?

Final confirm with you whether this returned html response is showing what you want.
However, the <div> can't show this html response result instead of alert() method only, right?

success: function(html){
        alert(html); //can display html result correctly, right?     

         setTimeout(DisplayResponse("promo_"+i,html),100); //can't show the html result in promo's <div>, right?

Select allOpen in new window

Exactly yes,

alert(html); returns me the correct result
setTimeout(DisplayResponse("promo_"+i,html),100); does not update the div

Select allOpen in new window

Good! Now if you put call the value manually, can you see the <div> display the value inside the success event?

document.getElementById("promo_"+i).innerHTML="testing";

Select allOpen in new window

It displays 3 times testing one after another

Mean the "testing" manual message display correctly as well? Now change to display the html response message.

document.getElementById("promo_"+i).innerHTML=html;

Select allOpen in new window

It indeed displays the DIV, as at the very beginning, it displays the content of the div but does not update it.

Can you change cache: true instead? Otherwise the requested changes may not reflected in the browser after the response returned.

No change...

<script>
$(document).ready(function(){

function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');

      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: true,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
        document.getElementById("promo_"+i).innerHTML = html;

        i=parseInt(i)+1;
        if(i<intTotal){setTimeout(loadLog(i), 1000);}
      }
      });
   }      

//function DisplayResponse(promo_ID,html){
//  document.getElementById(promo_ID).innerHTML=html;
//}

setTimeout(loadLog(0), 1000);
});
</script>

Select allOpen in new window

Try using done() instead of success() function:

<script>
$(document).ready(function(){

function loadLog(i) {
      var reference   = document.getElementById("txt_reference_" + i).value;
      var intTotal   = parseInt('<?php echo $i; ?>');

      $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: true,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      done: function(html){
        document.getElementById("promo_"+i).innerHTML = html;

        i=parseInt(i)+1;
        if(i<intTotal){setTimeout(loadLog(i), 1000);}
      }
      });
   }      

//function DisplayResponse(promo_ID,html){
//  document.getElementById(promo_ID).innerHTML=html;
//}

setTimeout(loadLog(0), 1000);
});
</script>

Select allOpen in new window

More information:
https://codesport.io/coding/jquery-ajax-success-and-done/

No display there.
I even added the console response, but nothing with done:
I told myself that I did something stupid, but success: still showed me both the console and the div.

I do not know what to do...

<script>
$(document).ready(function(){

function loadLog(i) {
   var reference   = document.getElementById("txt_reference_" + i).value;
   var intTotal   = parseInt('<?php echo $i; ?>');
   $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: true,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
         document.getElementById("promo_"+i).innerHTML = html;
         console.log(html);
         i=parseInt(i)+1;
         if(i<intTotal){setTimeout(loadLog(i), 1000);}
      }
   });
}
   setTimeout(loadLog(0), 1000);
});
</script>

Select allOpen in new window

I thought maybe I skipped something...rechecking my _promo.php page, I saw in the ID of the div the same ID called on index.php
So I corrected this, staying one by one each correction that has been proposed since the beginning of our exchange, but still the same problem arises...

The div of my index.php does display the content of _promo.php but does not update the content of this page every second.

Just out of curiosity, have you tried to do a simulation with my complete code (index, _promo, table)? did the function work for you?
Is the problem with this <script> function or somewhere else? I do not know what to think anymore.

Do you might to share the revised complete code here? Let me stimulate to fix once for all what's missing.

Of course

index.php

<?php include($_SERVER["DOCUMENT_ROOT"]."/includes/header.php"); ?>


<?php
try {
        $stat = $pdo->query( "SELECT * FROM tab_shop_produits");
        $i = 0;
        while ($data = $stat->fetch( PDO::FETCH_ASSOC)) {
         $reference = $data["reference"];
?>


<div id="promo_<?php echo $i; ?>" class="mb-2 text-end small text-success blink_"></div>


<input type="hidden" id="txt_reference_<?php echo $i; ?>" value="<?php echo $reference; ?>">
<?php $i++;}} catch(PDOException $e){echo "<div class='alert alert-danger'>".$e->getMessage()."</div>";} ?>


<script>
$(document).ready(function(){


function loadLog(i) {
   var reference   = document.getElementById("txt_reference_" + i).value;
   var intTotal   = parseInt('<?php echo $i; ?>');
   $.ajax({
      type: "POST",
      url: "_promo.php",
      cache: true,
      data: {reference: reference},
      error: function (e) {console.log('Ajax Error', e);alert('Erreur Ajax');},
      success: function(html){
         document.getElementById("promo_"+i).innerHTML = html;
         console.log(html);
         i=parseInt(i)+1;
         if(i<intTotal){setTimeout(loadLog(i), 1000);}
      }
   });
}
   setTimeout(loadLog('<?php echo $i; ?>'), 1000);
});
</script>


<?php include($_SERVER["DOCUMENT_ROOT"]."/includes/footer.php"); ?>

Select allOpen in new window

_promo.php

<?php
require_once($_SERVER['DOCUMENT_ROOT']."/includes/config.php");
if(isset($_POST["reference"])) {
   
$stat = $pdo->query( "SELECT fin_promo FROM tab_produits WHERE reference = '".$_POST["reference"]."' ");
        while ($pro = $stat->fetch( PDO::FETCH_ASSOC)) {
         $fin_promo    = $pro["fin_promo"];
         
if(!empty($fin_promo) AND $fin_promo > date("Y-m-d H:i:s")){
$date1       = strtotime("now"); 
$date2       = strtotime($fin_promo);
$diff       = abs($date2 - $date1);
$years       = floor($diff / (365*60*60*24));
$months    = floor(($diff - $years * 365*60*60*24) / (30*60*60*24));
$days       = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24)/ (60*60*24));
$hours       = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24) / (60*60)); 
$minutes    = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60)/ 60); 
$seconds    = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60 - $minutes*60)); 
   
if($months == 0) {$mois = null;}
if($months >= 1) {$mois = $mois." mois, ";}

if($days == 0) {$jour = null;}
if($days == 1) {$jour = $days." jour, ";}
if($days >= 2) {$jour = $days." jours, ";}

if($hours == 0) {$heure = null;}
if($hours == 1) {$heure = $hours." heure, ";}
if($hours >= 2) {$heure = $hours." heures, ";}
   
if($minutes == 0) {$minute = null;}
if($minutes == 1) {$minute = $minutes." minute";}
if($minutes >= 2) {$minute = $minutes." minutes";}
   
if($seconds == 0) {$seconde = null;}
if($seconds == 1) {$seconde = " et ".$seconds." seconde";}
if($seconds >= 2) {$seconde = " et ".$seconds." secondes";}

$promo = "La promo se termine dans ".$mois.$jour.$heure.$minute.$seconde;
   } else {
$promo = null;
}
      }
   echo $promo;
}
?>

Select allOpen in new window

table :

CREATE TABLE `tab_shop_produits`  (
  `id` int NOT NULL AUTO_INCREMENT,
  `nic_handle` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `reference` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
  `personnalisation` text CHARACTER SET utf8 COLLATE utf8_general_ci NULL,
  `quantite` float NULL DEFAULT 0,
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = MyISAM AUTO_INCREMENT = 4 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

INSERT INTO `tab_shop_produits` VALUES (1, 'JA90717', 'TC57', 'personnalisation', 1);
INSERT INTO `tab_shop_produits` VALUES (2, 'JA90717', 'TC30', '', 1);
INSERT INTO `tab_shop_produits` VALUES (3, 'JA90717', 'cheque-cadeau', NULL, 1);

Select allOpen in new window

Need to final clarify these items
>>

The div of my index.php does display the content of _promo.php but does not update the content of this page every second.

Mean you can get the html response from php for this line of update

...
$promo = "La promo se termine dans ".$mois.$jour.$heure.$minute.$seconde;
...
echo $promo;

Select allOpen in new window

However, can't get the html response display updated in the promo_index div. You have tried if put manual text here can show, right?

...
success: function(html){
         document.getElementById("promo_"+i).innerHTML = html; //html output correctly, but can't display in this div control, right?
         console.log(html);
         i=parseInt(i)+1;
         if(i<intTotal){setTimeout(loadLog(i), 1000);}
      }

Select allOpen in new window

Mean you can get the html response from php for this line of update

Yes, the content of _promo.php is displayed when my index.php page loads
The time therefore remains frozen and the content, even if I change it manually (_promo.php) is not updated in

<div id="promo_<?php echo $i; ?>"></div>

Select allOpen in new window

You can see the result here : epoxynwood.com/shop/test.php

The time therefore remains frozen and the content 

So the <div> display in two result only until it frozen, right? That's mean <div> showing the results, only the third <div> not showing correct result instead of frozen only?

No no, there I have 3 saved in my basket, but 2 of them have a promotion date.
So _promo.php displays the remaining time of the promo for each item on promotion and displays "blank" for the product that is not.
That's why I have 2 dates.

So the objective here is to display in front of each article, how much time it has left for its promotion.

Yes on that side no worries, but you will find that if you refresh the test.php page, the timer changes every second, but not automatically as the script would like.

We should have 59, 58, 57.... and so on

Sorry to bother you with my code (lol)
I don't have anything to post there though :p

No worry. I'm glad you find the answer already :)

The first example looks good, except I don't see the countdown scrolling like here: http://hilios.github.io/jQuery.countdown/

Check again my last post...You only reset the i counter, don't put your timer inside.

if(i>=intTotal){i=0;//reset..}

Select allOpen in new window

Oh my God !!!!!
It works now :'((((
Thank you very much David! Honestly, I couldn't believe it!
Thank you thank you thank youuuuuuuuuuuuu

Advisable not send unlimited requests. Otherwise the server will consider your website is spamming the users...

429 Too Many Requests
The HTTP 429 Too Many Requests response status code indicates the user has sent too many requests in a given amount of time ("rate limiting").

More information:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/429

Yes, but how to fix that?
I think the problem comes from here:

if(i>=intTotal){i=0;}

Select allOpen in new window

Don't think that's cause of the HTTP429 error issue. This line of code only reset the i variable counter to 0 which can reinstate the timer process.

if(i>=intTotal){i=0;}

Select allOpen in new window