How to automatically refresh data for all users when database gets updated?

[emmat83]

I’m working on a simple bidding system and need help with real-time updates. Right now when someone places a bid, only their page refreshes to show the new amount. Other people viewing the same page don’t see the updated bid unless they manually refresh.

I want all users to automatically see new bids without having to refresh their browsers. I’ve heard about polling and AJAX but I’m not sure which approach works best.

Here’s my current setup for displaying items:

<div class="item-container">
<h2 class="item-header">Kitchen Items</h2>

<?php
$connection = mysqli_connect("host","user","pass","database");

if (mysqli_connect_errno()) {
    echo "Database connection failed: " . mysqli_connect_error();
}

$query = mysqli_query($connection,"SELECT * FROM bidding WHERE type = 'Kitchen' ORDER BY item_id ASC");

while($data = mysqli_fetch_array($query)) {
    echo "<form class='bid-form' id='item" . $data['item_id'] . "'>
            <input type='hidden' name='item_id' value='" . $data['item_id'] . "' />
            <div class='item-block'>
                <div class='item-title'>" . $data['product_name'] . "</div>";
    echo "<img class='product-img' src='" . $data['photo_url'] . "' />";
    echo "<div class='current-price'>Latest Bid: $<span class='price-display' id='price_" . $data['item_id'] . "'>" . $data['top_bid'] . "</span></div>";
    echo "<div class='bidder-info'>Enter Name: <input type='text' class='name-field' name='user_name' /></div>";
    echo "<div class='bid-info'>Enter Amount: <input type='text' class='amount-field' name='bid_amount' /></div>";
    echo "<div class='submit-area'><input type='submit' name='submit_bid' value='Submit Bid' /></div>";
    echo "</div></form>";
}

mysqli_close($connection);
?>

My JavaScript handles the bid submission:

$(document).ready(function(){
    $('.bid-form').submit(function(){
        var itemId = $(this).find('input[name="item_id"]').val();
        var userName = $(this).find('input[name="user_name"]').val();
        var bidAmount = $(this).find('input[name="bid_amount"]').val();
        var currentPrice = $('#price_' + itemId).text();
        var productName = $(this).find('.item-title').text();

        if (userName == '') {
            alert("Please enter your name");
            return false;
        }

        if (bidAmount > currentPrice) {
            alert("Bid accepted");
        } else {
            alert("Bid too low");
            return false;
        }

        $.ajax({
            type: "POST",
            url: "process-bid.php",
            data: {user_name: userName, bid_amount: bidAmount, item_id: itemId, product_name: productName},
            success: function(response){
                location.reload();
            }
        });
        return false;
    });
});

The PHP file that updates the database:

<?php
$connection = mysqli_connect("host","user","pass","bidding_db");

if (mysqli_connect_errno()) {
    echo "Connection error: " . mysqli_connect_error();
}

$user_name = $_POST['user_name'];
$bid_amount = $_POST['bid_amount'];
$item_id = $_POST['item_id'];
$product_name = $_POST['product_name'];

$update_query = "UPDATE bidding SET top_bid = '$bid_amount', winner = '$user_name' WHERE item_id = '$item_id'";
$log_query = "INSERT INTO bid_history (product_name, amount, bidder_name) VALUES ('$product_name','$bid_amount','$user_name')";

mysqli_query($connection, $update_query);
mysqli_query($connection, $log_query);

mysqli_close($connection);
?>

I need a way to push these database changes to all users viewing the page. Any suggestions on how to implement this would be great. Thanks for any help you can provide.

[sophiac]

Long polling’s probably your best bet. I built this for a project dashboard where multiple users needed instant task updates. Send an AJAX request to a PHP script that waits for database changes before responding, then fire another request right when you get the response back. Set up a separate endpoint that checks for bid updates with a timestamp - have it sleep in a loop until new data shows up or it times out. Way more efficient than regular polling since you’re not constantly hitting the server, and it’s much simpler than websockets. Just handle connection timeouts properly and maybe add regular polling as a fallback if long polling craps out.

[Hermione_Book]

I built something similar for a real estate site and SSE worked great for this. Way simpler than websockets and handles reconnections automatically. Just create a PHP script that keeps the connection open and pushes updates when bids change, then use JavaScript’s EventSource API to listen. You get a persistent connection without all the websocket complexity, plus automatic fallback to polling if things break. For your bidding system, just modify your process-bid.php to trigger an SSE update after you hit the database.

[emcarter]

just poll with ajax every 3-5 secs to check for new bids. set up a simple endpoint that returns current bid data and compare it on the client side. not the prettiest solution, but it’s dead simple and works without any fancy server setup.

[Sophia63]

websockets can be fussy but polling with setInterval evry few sec is pretty effective. make a PHP script that grabs the latest bids and returns JSON, and then just refresh the display when there’s a change. It’s simple and works!