0

I need to pass product id to javascript function so that every product shows different time when added to the booking page. Currently it is showing same time even if I add multiple products to booking e.g.

I am getting

27:12 Product 1

27:12 Product 2

but I need

27:12 Product 1

29:30 Product 2

I dont have much expertise in Javascript because of which I am lacking in to it. My script and part of PHP Laravel code is below. Thank you for the help

SCRIPT

<script>
var count = 1800;
var counter = setInterval(hockeytimer, 1000);

function hockeytimer() {
  setSessionStorage(count)
  count = sessionStorage.getItem('count') - 1;
  sessionStorage.setItem('count', count);
  
  if (count == -1) {
    clearInterval(counter);
    return;
  }

  var seconds = count % 60;
  var minutes = Math.floor(count / 60);
  var hours = Math.floor(minutes / 60);
  minutes %= 60;
  hours %= 60;

  if (hours === 0 && minutes === 0  && seconds === 0 ) {
    var table = document.getElementById("hockeyt");
    for (var i = 0 ; i <= table.rows.length+2; i++) {
      table.deleteRow(i-1);
    }
  }
  
  var time_str = hours + ":h " + minutes + ":m " + seconds + ":s";

  var timerCells = document.querySelectorAll('.hockeytimer');
  
  for (var i = 0; i < timerCells.length; i++) {
    var timerCell = timerCells[i];
    timerCell.innerHTML = time_str;
  }
}

function setSessionStorage(countVal) {
  if(sessionStorage.getItem('count') <= 0){
    sessionStorage.setItem('count', countVal);
  }
  if(!sessionStorage.getItem('count')) {
    sessionStorage.setItem('count', countVal);
  }
}
 </script>

HTML

 <div style="display:none;" data-product-name="{{$p->product_name}}" id="product-id"></div>
 <div class="hockeytimer"></div>
Asad Sajjad
  • 19
  • 8
  • 1
    Does this answer your question? [How do I pass variables and data from PHP to JavaScript?](https://stackoverflow.com/questions/23740548/how-do-i-pass-variables-and-data-from-php-to-javascript) – Oleg Nurutdinov Jul 13 '20 at 16:53
  • @Asad, if you used **script** tag in blade, then you can do that easily with **{{ $var }}** – STA Jul 13 '20 at 16:57
  • Are you sure it's a problem of passing the value from the server? In the client-side code (view page source in your browser), what is the `data-product-name` value for the `id="product-id"` element? Is it what you expect it to be? The "timer" code in JavaScript looks like it's only creating a single timer and setting that timer's output to every row in a table. I don't see where/how PHP is even involved with that logic. – David Jul 13 '20 at 16:57
  • @STA yes I am using that in blade.php. How can I pass it in js? What should be the syntax please? – Asad Sajjad Jul 13 '20 at 17:04
  • @David how can I add that timer differently for each row then so that every product can have their own time – Asad Sajjad Jul 13 '20 at 17:05
  • @OlegNurutdinov I cant be able to understand the link – Asad Sajjad Jul 13 '20 at 17:06
  • From the link Oleg posted: https://stackoverflow.com/a/24834434/5159168 this is a simple example. – Andreas Jul 13 '20 at 17:11
  • @AsadSajjad: I guess you'd create a different timer for each row. – David Jul 13 '20 at 17:19
  • @David how I did that in the table under `@foreach` loop. I dont know where am I doing this wrong – Asad Sajjad Jul 13 '20 at 18:03

0 Answers0