Home/ Questions/Q 8712685
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T05:09:33+00:00

I’m creating a sport app with Django. I need to display a list of

  • 0

I’m creating a sport app with Django. I need to display a list of matches with a countdown that goes to the exact hour of those matches.

Everything works find, except that the countdowns go to the day of the matches, not the hours and minutes. For example, if a match begin in 2 days at 9 pm, the countdown will stop at midnight the day of the match. So it won’t go to 9pm.

Here is my code:

<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://keith-wood.name/js/jquery.countdown.js">    </script>
</head>

<body>

<div style="float:left">
{% for match in matches %}
<div>  
    <p>{{ match }}</p>
    <p> {{match.real_start}} <p>
    <a href="{{ match.get_absolute_url_grille }}">Go</a>
    <div class="match_countdown" data-date="{{ match.real_start|date:'M j, Y'}}"></div>
</div>
{% endfor %}
</div>
</br></br>


<script>

$('.match_countdown').each(function() {
var self = $(this),
    date_string = self.attr('data-date'),
    date = new Date(date_string);
self.countdown({until: date});
});
</script>

</body>

“real_start” is my DateTime
I guess the problem is about the date format ‘M j ,Y’ that doesn’t match a DateTimeField. But I didn’t find how to fix it.

Any help would be welcome. Thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The best solution in my opinion is to convert the you DateTimeField model attribute in the Python code to a timestamp, converted to milliseconds. Either do so by adding a method to your model which takes care of that logic, which is the easiest solution and then parse that string in javascript to get milliseconds or otherwise write a Django Filter but that’s slightly more complicated.

    import time
import datetime

def datetime_to_milliseconds(some_datetime_object):
    timetuple = some_datetime_object.timetuple()
    timestamp = time.mktime(timetuple)
    return timestamp * 1000.0

## Example using this
now = datetime.datetime.now()
millisecond_timestamp_now = datetime_to_milliseconds(now)

    (The code is verbose by choice, to make it easier for you to grasp the logic).

    Your Javascript should then be something along the lines of:

    $('.match_countdown').each(function() {
    var self = $(this),
    date_string = self.attr('data-date'),
    date_milliseconds = Number(date_string);
    date = new Date(date_milliseconds);
    self.countdown({until: date});
});

    Basically something along those lines should do the deal, just adapt it to a method.

    A tip for the future, try to avoid putting a lot of logic in your templates, it’s error prone and not really a good practice (unless it’s rendering logic only, even then there’s better solutions).

    Good luck.

    • 0