live counter with jquery

Question

In my stats page, I show number of active members with the following asp code. <% SQL = "SELECT COUNT(MEMBERID) AS TOTALMEMBERS" SQL = SQL & " FROM MEMBERS" SQL = SQL & " WHERE ACTIVE = 1" Set objCountMembers = objConn.Execute(SQL) %> We currently have <%=objCountMembers("TOTALMEMBERS")%> members.

At this website, http://vkontakte.ru/index.php counter is lively updated. I was wondering if this was possible to do with jquery, if yer how.

Answer 1

My guess is that it's made with a client side js timeout that increments that number every couple seconds.

Answer 2

Looking at the source code, they've just assumed a number of users per second and then have a setTimeout() updating the number.

If you wanted a real number there you would need to use AJAX.

Answer 3

It is indeed possible to do with jQuery.

Create an asp page that only outputs the count of users (the code from your question will work).

Include something like this HTML on the page you want to count to appear on:

<div>
    <span id="userCount">0</span> Active Users
</div>

and this jQuery snippet inside a script tag:

$(function() {
    function updateUserCount() {
        $('#userCount').load('/CountingPage.asp');
    }

    setInterval(updateUserCount, 15000);
});

This code will show an updated user count every 15 seconds. The .load call will retrieve the given URL asynchronously and replace the inner HTML of the selected element with the content returned.

Answer 4

jQuery's load function is a short hand for an AJAX call.
Checkout the jQuery documentation for more really useful functions like this.