I have a site with a liveticker which loads new forum events and adds them to an HTML table.
For the time field I am ajax-loading the datetime of each event (e.g. 2013-02-15 17:28:03
), and converting them via jquery plugin cutetime to human readable format, e.g. 22 minutes ago
.
Problem with CuteTime is that the recent version (from 2010) has some issues in dealing with dynamically loaded AJAX data.
My current solution seems to work a bit:
1.At first the ajax call loads the entire forum events as html table, then I assign the cutetime plugin:
// initial load at page startup
$('#responsecontainer').load('./liveticker', {ajax:1}, function() {
// convert datetime to readable date format
$('.timestamp').cuteTime();
});
2.Then I check every 30 seconds for new events, and assign cuteTime each time on the loaded data:
$('#responseEvents').load('./liveticker', {ajax:lastevent}, function() {
// stuff...
// convert datetime to readable date format
$('.timestamp').cuteTime();
})
This seems to work in Firefox and Chrome. However, in Internet Explorer 9 all $(.timestamp)
elements get the same text assigned: just now
.
Does anyone know a solution to this bug / problem?
--
Note: On the cutetime-site I found a comment about ajax. Somebody there stated his workaround:
I had to hack my app to make additional fields so i first copy all the values into all my spans, then call cuteTime.
But I am not sure if this is in any way connected to the Internet Explorer Bug I am facing now...
console.log($('.timestamp').text());
both match in Internet Explorer and Firefox before conversion. Just after conversion with line$('.timestamp').cuteTime();
the IE version is setting the same string on each event item.!($.browser.msie)
. Would be glad if anyone can help me still...