Question

I have problem to put several countdowns on page. I use HTML.Partial:

<span><strong id="time_h"></strong>godz. <strong id="time_m"></strong>
min. <strong id="time_s"></strong>s.</span>

And I also have there:

<script type="text/javascript">

    $(document).ready(startTime);
    var datefrom = new Date();
    var dateto = new Date(@Model.EndDate.Year, @Model.EndDate.Month-1, @Model.EndDate.Day, @Model.EndDate.Hour, @Model.EndDate.Minute, @Model.EndDate.Second);
    var diff  = dateto.getTime() - datefrom.getTime(); </script>

And my countdown function looks like:

function startTime(){
diff = diff - 500;

if (diff <= 0)
{
    $("#time_on").hide();
    $("#time_off").show();
} else {


    $("#time_h").html(h);
    $("#time_m").html(checkTime(m));
    $("#time_s").html(checkTime(s));
}

t = setTimeout('startTime()',500);}

  function checkTime(i){
if (i<10)
  {
  i="0" + i;
  }
return i;}

Then I put Partial in foreach loop. Everything goes fine if there is only one row in collection. If there is more than 1 there is only first countdown counting. When I use class instead of id in span (time_h and so on) it displays the same time on each item. Is it good approach? What should I change?

Thanks
Kamil

Answer 1

Ok. I have it. It was because the long time of converting from int to date. I do now diff = diff – 1000 and it shows properly.