Question

I have got a page on a website, that works similar to a reverse auction. It has a javascript countdown timer that runs down depending on how long the auction is. When it hits zero the auction ends and page refreshes.

All works like a dream, but the problem is if a bid is put in I wanted the page to refresh displaying that bid, and update many other elements.

The site currently does this by checking a php file via flash and when flash notices the change refreshes the page. This is fine, but we wont to remove flash and only use javascript so we don’t have any problems running the site on iPhones/iPads and other mobile devices.

So, after a long winded build-up I need a solution, be this AJAX or another method, any help more than welcome here…

Thanks in advance

Answer 1

You should create a div id for showing the bid amount. And use jQuery to update the amount via AJAX call as done below.

setTimeout('update_amount()', 1000);

function update_amount(){
        var amt = $("#amount").html();
        $.post('ajax_file.php?a='+amt, function(data){
        if(data!=''){
            $('#amount').html(data);                
        }

Here the current value displayed in the page is stored into amt. Then this value is passed to the php file via AJAX as post. You will have to do the procedures to check whether the amount has changed in the mySql table and if changed just echo the new amount in that php file. That amount will be updated in the amount div id in the current page.