1

I want to create a countdown timer which is integrated with the back-end. I'm using Django. I could have done this in jQuery (so many plugins being available), but I dont how to integrate it with the backend.

I send a list of products from views in the ctx variable {'products':products}. The format is as follow :-

[
    {
        price: 9830,
        date: "2015-09-06T07:45:41Z",
        image: "image.png",
        id: 1
    },
    {
        price: 9830,
        date: "2015-08-16T07:45:41Z",
        image: "image.png",
        id: 2
    },

    ....
]

I want to show these products on HTML, here's how I'm doing:-

{% for item in products %}
    <div class="item"> 
        <a href="/product/{{item.id}}">
            <span class="item-carousel-thumb">
                <img class="img-responsive" src="{{product.image}}" alt="img">
            </span>
            <span class="price"> <i class="fa fa-inr"></i> {{product.price}} </span>
            <span class="stop-watch"> Over here I want to show the countdown timer </span>
        </a>
    </div>
{% endfor %}

In the tag <span class="stop-watch">, I want to show the countdown timer similar to this. How can I do this?

The countdown timer = Current Time - the time provided in the result.

Praful Bagai
  • 16,684
  • 50
  • 136
  • 267
  • 1
    so i'm not sure what the problem is. You will need to take your django date time and build a JavaScript datetime object. any sort of countdown should run in the browser and it should be all JavaScript from that point on. – Chris Hawkes Aug 14 '15 at 18:04
  • A sample code would help. Thanks :) – Praful Bagai Aug 14 '15 at 18:05
  • 1
    so if you're date coming from your DB is the standard django yyyy-mm-dd than this answer gives an idea of how to create a JavaScript date object with it. http://stackoverflow.com/questions/7151543/convert-dd-mm-yyyy-string-to-date – Chris Hawkes Aug 14 '15 at 18:08
  • That is fine. I know How to create a timer in jQuery. But the question rather is how do I integrate it with the back-end.? I can get the back-end datetime values in javascript as well, using `escapejs`. But the question will be again that I would representing some data using jinja and some using javascript, which to me does not sound good. – Praful Bagai Aug 14 '15 at 18:26
  • Hence, a working example would be of great help. – Praful Bagai Aug 14 '15 at 18:27

0 Answers0