Real time progress bar With PHP

Today, We want to share with you Real time progress bar With PHP.In this post we will show you progress bar in php source code, hear for file upload progress bar with percentage using php we will give you demo and example for implement.In this post, we will learn about real time progress bar implementation for php with an example.

Real time progress bar With PHP

There are the Following The simple About Advance Live progress bar With PHP Full Information With Example and source code.

As I will cover this Post with live Working example to develop Bootstrap Progress bar to show long running PHP script, so the Improve User Experience with a Real-time Progress Bar for this example is following below.

Real time progress bar in PHP

Step 1: HTML Code

<div class="pakainfo container">
  <div class="dsp row">
    <div class="dsp col-md-12">
	    <p> </p>
		<p> </p>
		<button type="button" id="submit_categories"  class="btn btn-success btn-block">Click Here To Live Start Progress Bar</button>
		<p> <p>
		<button type="button" id="submit_products"  class="btn btn-danger btn-block">Click Here To Live Stop Progress Bar</button>
    </div>
    <div class="pakainfo col-md-12">
		<p> </p>
	    <p> </p>
		<div id="live_progress_bar" style="border:1px solid #ccc; border-radius: 5px; "></div>
  
		<!-- PHP Simple Progress preview_details -->
		<br>
		<div id="preview_details" ></div>
	</div>
  </div>
</div>

<iframe id="preview_area" style="display:none;"></iframe><br />

Step 2: JavaScript Source code

<script >
	$("#submit_categories").click(function(){
		document.getElementById('preview_area').src = 'live_progress_bar.php';
	});
	$("#submit_products").click(function(){
		document.getElementById('preview_area').src = '';
	});
</script>

Step 3: PHP Code – live_progress_bar.php

<?php
session_start();

ini_set('max_execution_time', 0); // to fetch unlimited simple php script run execution time

if(empty($_SESSION['i'])){
    $_SESSION['i'] = 0;
}

$total = 100;
for($i=$_SESSION['i'];$i<$total;$i++)
{
    $_SESSION['i'] = $i;
    $total_percentage = intval($i/$total * 100)."%";   
	
    sleep(1); // Here simple jquery ajax call your time taking methods like sending data bulk products etc.

    echo '<script>
    parent.document.getElementById("live_progress_bar").innerHTML="<div style=\"width:'.$total_percentage.';background:linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); ;height:35px;\"> </div>";
    parent.document.getElementById("preview_details").innerHTML="<div style=\"text-align:center; font-weight:bold\">'.$total_percentage.' is processed.</div>";</script>';

    ob_flush(); 
    flush(); 
}
echo '<script>parent.document.getElementById("preview_details").innerHTML="<div style=\"text-align:center; font-weight:bold\">Good Luck : Process completed</div>"</script>';

session_destroy(); 

Web Programming Tutorials Example with Demo

Read :

Read Also:  How to play audio using javascript?

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Simple Real Live progress bar in PHP.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.