javascriptjqueryhtmljquery-countdown

Set jQuery.countdown Multiple instances on the same page with Timezone Aware (MomentJS)


I need to set jQuery.countdown Multiple instances on the same page with Timezone Aware using MomentJS as per the documentation in the website:

So far I have this:

<div data-countdown="2018-01-01 12:00:00"></div>
<div data-countdown="2019-01-01 12:00:00"></div>
<div data-countdown="2020-01-01 12:00:00"></div>

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

    jQuery("[data-countdown]").each(function() {

        var jQuerythis = jQuery(this), finalDate = jQuery(this).data("countdown");

        finalDate = moment.tz(finalDate, "Europe/London"); // <-- ***THIS IS NOT WORKING***

        jQuerythis.countdown(finalDate, function(event) {           
            jQuerythis.html(event.strftime("%D days %H:%M:%S"));            
        });

    });

});             
</script>

But it is not working. I don't think the follwing line is overall correct:

finalDate = moment.tz(finalDate, "Europe/London");

MomentJS is installed properly and if I remove the one line above everything works but without timezone awareness.

Could you provide with some suggestions please?


Solution

  • To whoever needs it, I was missing this portion ".toDate()" in the following line:

    jQuerythis.countdown(finalDate.toDate(), function(event) {
    

    So now everything works beautifully!

    I found the solution with help from this blog article Final Countdown jQuery plugin Multiple instances on the same page with Timezone Aware

    jQuery.countdown Multiple instances on the same page with Timezone Aware (MomentJS).

    Thanks to everybody that helped!