Link to home
Start Free TrialLog in
Avatar of Jaber Ahmad
Jaber AhmadFlag for Côte d'Ivoire

asked on

Refresh a value from a table in JavaScript

Hi all,
I am asking for your help on a small project that I am implementing, that of updating a value in my database.
Since there is a value to enter in a textbox, I cannot load everything (well I think) on another page and refresh every second ...
Here is my complete code and I can't refresh Enchere_Max

User generated image
index.php
<?php try{$Stat = $pdo->query("SELECT * FROM tb_shop_enchere"); while($data = $Stat->fetch(PDO::FETCH_ASSOC)) { $MyId = $data["NumId"]; ?>

<div id="Enchere_<?php echo $MyId; ?>"></div>

<script>
$(document).ready(function() {
	setInterval(function() {
		$('#Enchere_<?php echo $MyId; ?>').load('refresh.php');
	}, 1000);
});
</script>

<?php }}catch(PDOException $e){echo "<div class='alert alert-danger'>".$e->getMessage()."</div>";} ?>

Open in new window


refresh.php
<?php try{$Stat = $pdo->query("SELECT * FROM tb_shop_enchere WHERE NumId = '".$MyId."'"); while($data = $Stat->fetch(PDO::FETCH_ASSOC)) { ?>

<?php echo $data["Enchere_Max"];?>

<?php }}catch(PDOException $e){echo "<div class='alert alert-danger'>".$e->getMessage()."</div>";} ?>

Open in new window

Maybe my method is not the right one, so if you can help me it would be nice.
Avatar of Michel Plungjan
Michel Plungjan
Flag of Denmark image

Seems you have your script inside a loop?


If so you will have

<div id="Enchere_<?php echo $MyId; ?>"></div>
<script>
$(document).ready(function() {
	setInterval(function() {
		$('#Enchere_<?php echo $MyId; ?>').load('refresh.php');
	}, 1000);
});
</script>
<div id="Enchere_<?php echo $MyId; ?>"></div>
<script>
$(document).ready(function() {
	setInterval(function() {
		$('#Enchere_<?php echo $MyId; ?>').load('refresh.php');
	}, 1000);
});
</script>
<div id="Enchere_<?php echo $MyId; ?>"></div>
<script>
$(document).ready(function() {
	setInterval(function() {
		$('#Enchere_<?php echo $MyId; ?>').load('refresh.php');
	}, 1000);
});
</script>

Open in new window

and that is not a great idea. IDs need to be unique


You also may need to bust the cache for refresh.php by adding a random value to the call

Avatar of Jaber Ahmad

ASKER

I don't know if I got it right, but you want me to get the refresh call out of the loop?

<?php try{$Stat = $pdo->query("SELECT * FROM tb_shop_enchere"); while($data = $Stat->fetch(PDO::FETCH_ASSOC)) { $MyId = $data["NumId"]; ?>

<div id="Enchere_<?php echo $MyId; ?>"></div>

<?php }}catch(PDOException $e){echo "<div class='alert alert-danger'>".$e->getMessage()."</div>";} ?>

<script>
$(document).ready(function() {
setInterval(function() {
$('#Enchere_<?php echo $MyId; ?>').load('enchere-refresh.php');
}, 1000);
});
</script>

Open in new window


enchere-refresh.php

<?php echo $data["Enchere_Max"];?>

Open in new window

If this example is what you are asking, how should I tell <?php echo $data["Enchere_Max"]; ?> Which belongs to the identifier $MyId?

I'm really lost there ...

I am not sure you want to do it that way

What does refresh.php do?

Can it be passed an ID or perhaps passed an array of IDs and return all of them? It is not clear from your code what the contents of each div is. 

Can you show me what you expect to see on the page and what refresh returns?

Perhaps you mean something like this (not tested - may need some work with closures)


let tId = {};
$(function() {
  $(".escherir").on("click",function() { // any click on a button with class = escherir
    const $div = $(this).closest("div[id^=Enchere]");
    const id = $div.attr(id); // the container ID
    cont val = $div.find("input").val(); // I do not know the input field - so change if needed
    clearInterval(tId[id])
    tId[id] = setInterval(function() { $(id).load("refresh.php?myId="+id+"&val="+val },1000);
  });
)};

Open in new window


ASKER CERTIFIED SOLUTION
Avatar of Jaber Ahmad
Jaber Ahmad
Flag of Côte d'Ivoire image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial

Ok... That is two server calls per second. Why not call one server process that returns two values, one for  Enchere and one for  Nombre

You're absolutely right.
But I'm not really good at js or ajax ...
Here is the refresh.php page :

<?php
if(isset($_GET['MyRef'])){
$MyRef = htmlspecialchars($_GET['MyRef']);

$Stat = $pdo->query("SELECT MAX(Enchere) AS Enchere FROM tb_shop_enchere_liste WHERE Reference='".$MyRef."' ");
while($data = $Stat->fetch(PDO::FETCH_ASSOC)){

echo number_format($data["Enchere"] / $MNY_Taux, 0, ',', ' ')." ".$MNY_Franc;

}}
?>

Open in new window

and the numbers page ... 

<?php
if(isset($_GET['MyRef'])){
$MyRef = htmlspecialchars($_GET['MyRef']);

$Nombre = $pdo->query("SELECT COUNT(NIC_Handle) FROM tb_shop_enchere_liste WHERE Reference='".$MyRef."' ")->fetchColumn();

if($Nombre > 1) {$Nbr = $Nombre." enchères";} else {$Nbr = $Nombre." enchère";}

echo $Nbr;

}
?>

Open in new window

 both have two different tables.


What do you offer me?

I do not know PDO, but I assume you will get ONE max value back from the loop


If you have something like this


<?php
if(isset($_GET['MyRef'])){
  $MyRef = htmlspecialchars($_GET['MyRef']);
  $enchere = 0;

  $Stat = $pdo->query("SELECT MAX(Enchere) AS Enchere FROM tb_shop_enchere_liste WHERE Reference='".$MyRef."' ");
  while($data = $Stat->fetch(PDO::FETCH_ASSOC)){
    $enchere = number_format($data["Enchere"] / $MNY_Taux, 0, ',', ' ')." ".$MNY_Franc;
  }}
  $Nombre = $pdo->query("SELECT COUNT(NIC_Handle) FROM tb_shop_enchere_liste WHERE Reference='".$MyRef."' ")->fetchColumn();
  if($Nombre > 1) {$Nbr = $Nombre." enchères";} else {$Nbr = $Nombre." enchère";}

  echo '{ "enchere":"'.$enchere.'", "nbr":"'.$Nbr.'"}';

}
?>

Open in new window

then you can do something like


let tId;
const ref = "<?php echo $MyRef; ?>";
$(function() {
  tId = setInterval(function() {
    $.get("refresh.php?MyRef="+ref+"&rnd="+new Date().getTime(),function(data) { // rnd is to bust the cache
      $('#Enchere_'+ref).html(data.enchere);
      $('#Nombre_'+ref).html(data.nbr);
    });
  }, 1000);
});  

Open in new window