If the quantity increases the progress bar must increase using php

Question

Hi,

I need exactly like the below URL which lies under the BUY IT button.

URL : http://www.buywithme.com/

When the no of purchase increases the progress bar will move step by step.

I need to implement exactly with this functionality.

Kindly refer me any idea or sample code.

Thanks in advance

Answer 1

If you actually need it to be accurate, you'll need to draw it client-side, most likely. Your PHP script can return a JSON object that describes the position of the progress bar, then your script draws it. Here's another question from SO that lists some JavaScript graphics options: http://stackoverflow.com/questions/675602/which-javascript-graphics-library-has-the-best-performance

Answer 2

PHP

$purchased_num = 13; // items purchased until now (example)

$max_width = 400; // the width of the bar
$max_pur   = 50;  // the maximum number of items
$one_pur_width = round( $max_width / $max_pur );

$width = $one_pur_width * $purchased_num;

// print the div with this width
// and style the bar with css
// ...

​

Answer 3

You should use jQuery to frequently reload that little section.

<div id="progBar">
</div>

<script type=text/javascript>
function refreshProgress() {
    $.get('/folder/progbar.php', function (data) {
       $('#progBar').html(data);
    }
    setTimeout('refreshProgress();',10000);
}

$(function () { refreshProgress(); });
</script>

This will load progbar.php when the page is loaded (which will generate the current progress bar based on sales at the time) into the div, and refresh it every 10 seconds.