I actually have 4 files and this is implemented based on the tutorial with this link
http://www.sitepoint...and-javascript/
**Form.php**
Expand|Select|Wrap|Line Numbers
- <html>
- <head>
- <title>File Upload Progress Bar of MySQL Data</title>
- <link rel="stylesheet" type="text/css" href="style.css">
- </head>
- <body>
- <div id="bar_blank">
- <div id="bar_color"></div>
- </div>
- <div id="status"></div>
- <?php
- $time_start = microtime(true);
- $mysqlserver = "localhost";
- $user = "root";
- $pass = "";
- $db = "Profusion";
- $link = mysql_connect( "$mysqlserver", $user, $pass );
- if ( ! $link )
- die( "Couldn't connect to MySQL" );
- //print "Successfully connected to server<P>";
- mysql_select_db( $db )
- or die ( "Couldn't open $db: ".mysql_error() );
- //print "Successfully selected database \"$db\"<P>";
- $result3=mysql_query("INSERT INTO dest_table.create_info SELECT * from Profusion.source_cdr") or die(mysql_error());
- $progress=mysql_affected_rows();
- $time_end = microtime(true);
- $time = $time_end - $time_start;
- echo "Total time taken :"." ".round($time,6) . " s";
- ?>
- 2nd file style.css
- #bar_blank {
- border: solid 1px #000;
- height: 20px;
- width: 300px;
- }
- #bar_color {
- background-color: #006666;
- height: 20px;
- width: 0px;
- }
- #bar_blank, #hidden_iframe {
- display: none;
- }
- 3rd file
- **script.js**
- function toggleBarVisibility() {
- var e = document.getElementById("bar_blank");
- e.style.display = (e.style.display == "block") ? "none" : "block";
- }
- function createRequestObject() {
- var http;
- if (navigator.appName == "Microsoft Internet Explorer") {
- http = new ActiveXObject("Microsoft.XMLHTTP");
- }
- else {
- http = new XMLHttpRequest();
- }
- return http;
- }
- function sendRequest() {
- var http = createRequestObject();
- http.open("GET", "progress.php");
- http.onreadystatechange = function () { handleResponse(http); };
- http.send(null);
- }
- function handleResponse(http) {
- var response;
- if (http.readyState == 4) {
- response = http.responseText;
- document.getElementById("bar_color").style.width = response + "%";
- document.getElementById("status").innerHTML = response + "%";
- if (response < 100) {
- setTimeout("sendRequest()", 1000);
- }
- else {
- toggleBarVisibility();
- document.getElementById("status").innerHTML = "Done.";
- }
- }
- }
- function startUpload() {
- toggleBarVisibility();
- setTimeout("sendRequest()", 1000);
- }
- /* (function () {
- document.getElementById("myForm").onsubmit = startUpload;
- })();// i commented this out since this collects information from the form
- and the last file
- **progress.php**
- <?php
- session_start();
- $key = ini_get("session.upload_progress.prefix") . $result3;
- if (!empty($_SESSION[$key])) {
- $current = $_SESSION[$key]["bytes_processed"];
- $total = $_SESSION[$key]["content_length"];
- echo $current < $total ? ceil($current / $total * 100) : 100;
- }
- else {
- echo 100;
- }