I am trying to put on דוגמנות website that Simple PHP Upload Progress Bar script
APC is already installed on your server and I have tweaked my php.ini as described on the instructions.
apc.rfc1867 = on
Now the problem is that I am getting a %NaN instead of the real number from the upload process.
I know that this script IS working on some other servers so I am going to assume that there is no bug on the script and it's just something related to the php.ini or to the APC.
This is my upload.php file:
<?php
//get unique id
$up_id = uniqid();
//process the forms and upload the files
if ($_POST) {
//specify folder for file upload
$folder = "tmp/";
//specify redirect URL
$redirect = "upload.php?success";
//upload the file
move_uploaded_file($_FILES["file"]["tmp_name"], "$folder" . $_FILES["file"]["name"]);
//do whatever else needs to be done (insert information into database, etc...)
//redirect user
header('Location: '.$redirect); die;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Upload your file</title>
<!--Progress Bar and iframe Styling-->
<link href="style_progress.css" rel="stylesheet" type="text/css" />
<!--Get jQuery-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.js" type="text/javascript"></script>
<!--display bar only if file is chosen-->
<script>
$(document).ready(function() {
//show the progress bar only if a file field was clicked
var show_bar = 0;
$('input[type="file"]').click(function(){
show_bar = 1;
});
//show iframe on form submit
$("#form1").submit(function(){
if (show_bar === 1) {
$('#upload_frame').show();
function set () {
$('#upload_frame').attr('src','upload_frame.php?up_id=<?php echo $up_id; ?>');
}
setTimeout(set);
}
});
});
</script>
</head>
<body>
<h1>Upload your file </h1>
<div>
<?php if (isset($_GET['success'])) { ?>
<span class="notice">Your file has been uploaded.</span>
<?php } ?>
<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
Name<br />
<input name="name" type="text" id="name"/>
<br />
<br />
Your email address <br />
<input name="email" type="text" id="email" size="35" />
<br />
<br />
Choose a file to upload
<br />
<!--APC hidden field-->
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="<?=$up_id?>"/>
<input name="file" type="file" id="file" size="30"/>
<!--Include the iframe-->
<br />
<iframe id="upload_frame" name="upload_frame" frameborder="0" border="0" src="" scrolling="no" scrollbar="no" > </iframe>
<br />
<input name="Submit" type="submit" id="submit" value="Submit" />
</form>
</div>
</body>
</html>
this is my upload_frame.php
<?php
$url = basename($_SERVER['SCRIPT_FILENAME']);
//Get file upload progress information.
if(isset($_GET['progress_key'])) {
$status = apc_fetch('upload_'.$_GET['progress_key']);
echo $status['current']/$status['total']*100;
die;
}
//
?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.js" type="text/javascript"></script>
<link href="style_progress.css" rel="stylesheet" type="text/css" />
<script>
$(document).ready(function() {
//
setInterval(function()
{
$.get("<?php echo $url; ?>?progress_key=<?php echo $_GET['up_id']; ?>&randval="+ Math.random(), {
//get request to the current URL (upload_frame.php) which calls the code at the top of the page. It checks the file's progress based on the file id "progress_key=" and returns the value with the function below:
},
function(data) //return information back from jQuery's get request
{
$('#progress_container').fadeIn(100); //fade in progress bar
$('#progress_bar').width(data +"%"); //set width of progress bar based on the $status value (set at the top of this page)
$('#progress_completed').html(parseInt(data) +"%"); //display the % completed within the progress bar
}
)},500); //Interval is set at 500 milliseconds (the progress bar will refresh every .5 seconds)
});
</script>
<body style="margin:0px">
<!--Progress bar divs-->
<div id="progress_container">
<div id="progress_bar">
<div id="progress_completed"></div>
</div>
</div>
<!---->
</body>
and this is my style_progress.css
/*iframe*/
#upload_frame {
border:0px;
height:40px;
width:400px;
display:none;
}
#progress_container {
width: 300px;
height: 30px;
border: 1px solid #CCCCCC;
background-color:#EBEBEB;
display: block;
margin:5px 0px -15px 0px;
}
#progress_bar {
position: relative;
height: 30px;
background-color: #F3631C;
width: 0%;
z-index:10;
}
#progress_completed {
font-size:16px;
z-index:40;
line-height:30px;
padding-left:4px;
color:#FFFFFF;
}
Let me know if there is a quick fix for that.
Where did you call apc_store()? I'm pretty sure this needs to be done before you can fetch the value using apc_fetch().
Related
I am trying to insert/submit the form data to XML but it is not saving anything into the XML file.. currently only sending the Latitude line to get it to work.
I've been working off the GitHub Geocomplete form scripts and attempting to add a send data to XML script but i can't see what is missing?
INDEX.PHP
<!DOCTYPE html>
<html>
<head>
<title>$.geocomplete()</title>
<meta charset="UTF-8">
<style type="text/css" media="screen">
form { width: 300px; float: left; }
fieldset { width: 320px; margin-top: 20px}
fieldset strong { display: block; margin: 0.5em 0 0em; }
fieldset input { width: 95%; }
ul span { color: #999; }
</style>
</head>
<body>
<?php
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml', LIBXML_NOBLANKS);
$latitude = $xmldoc->firstChild->firstChild;
if($latitude!=null){
while($latitude!=null){
echo $latitude->textContent.'<br/>';
$latitude = $latitude->nextSibling;
}
}
?>
<div class="map_canvas"></div>
<form name='input' action='insert.php' method='post'>
<input id="geocomplete" type="text" placeholder="Type in an address" value="Empire State Bldg" />
<input id="find" type="button" value="find" />
<fieldset>
<h3>Address-Details</h3>
<label>Latitude</label>
<input name="latitude" type="text" value="">
<label>Longitude</label>
<input name="lng" type="text" value="">
<label>Formatted Address</label>
<input name="formatted_address" type="text" value="">
<label>Locality</label>
<input name="locality" type="text" value="">
</fieldset>
<input type='submit' value='send'/>
</form>
<script src="http://maps.googleapis.com/maps/api/js?key=API KEY sensor=false&libraries=places"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="findlocation/jquery.geocomplete.js"></script>
<script>
$(function(){
$("#geocomplete").geocomplete({
map: ".map_canvas",
details: "form",
types: ["geocode", "establishment"],
});
$("#find").click(function(){
$("#geocomplete").trigger("geocode");
});
});
</script>
</body>
</html>
INSERT.PHP
<?php
header('Location:index.php');
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml');
$newAct = $_POST['latitude'];
$root = $xmldoc->firstChild;
$newElement = $xmldoc->createElement('latitude');
$root->appendChild($newElement);
$newText = $xmldoc->createTextNode($newAct);
$newElement->appendChild($newText);
$xmldoc->save('sample.xml');
?>
SAMPLE.XML
<list>
<latitude></latitude>
<list>
There are a few problems with the code you had, so I'll post the code and comments in the code should help.
<!DOCTYPE html>
<html>
<head>
<title>$.geocomplete()</title>
<meta charset="UTF-8">
<style type="text/css" media="screen">
form {
width: 300px;
float: left;
}
fieldset {
width: 320px;
margin-top: 20px
}
fieldset strong {
display: block;
margin: 0.5em 0 0em;
}
fieldset input {
width: 95%;
}
ul span {
color: #999;
}
</style>
</head>
<body>
<?php
$xmldoc = new DOMDocument ();
$xmldoc->load ( 'sample.xml', LIBXML_NOBLANKS );
// Fetch the latitude - using getElementsByTagName is a quick way of getting the
// data for a known element
$latitude = $xmldoc->getElementsByTagName ( 'latitude' ) [0]->nodeValue;
?>
<div class="map_canvas"></div>
<form name='input' action='insert.php' method='post'>
<input id="geocomplete" type="text" placeholder="Type in an address"
value="Empire State Bldg" /> <input id="find" type="button"
value="find" />
<fieldset>
<h3>Address-Details</h3>
<label>Latitude</label>
<input name="latitude" type="text"
value="<?php echo $latitude; ?>">
<label>Longitude</label>
<input
name="lng" type="text" value="">
<label>Formatted Address</label>
<input
name="formatted_address" type="text" value="">
<label>Locality</label>
<input name="locality" type="text" value="">
</fieldset>
<input type='submit' value='send' />
</form>
<script
src="http://maps.googleapis.com/maps/api/js?key=API KEY sensor=false&libraries=places"></script>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="findlocation/jquery.geocomplete.js"></script>
<script>
$(function(){
$("#geocomplete").geocomplete({
map: ".map_canvas",
details: "form",
types: ["geocode", "establishment"],
});
$("#find").click(function(){
$("#geocomplete").trigger("geocode");
});
});
</script>
</body>
</html>
insert.php
As your XML already contained the latitude element, there was no need to create a new one.
<?php
if ( isset($_POST['latitude']) ){
$xmldoc = new DOMDocument();
$xmldoc->load('sample.xml');
// Fetch node to update (use [0] sd getElementsByTagName returns
// an array of matching nodes)
$latitude = $xmldoc->getElementsByTagName('latitude')[0];
// Set node value
$latitude->nodeValue = $_POST['latitude'];
$xmldoc->save('sample.xml');
}
// Now the data is processed, redirect to main page
header('Location:index.php');
sample.xml
(Note that your close list element was and not
<list>
<latitude></latitude>
</list>
this is my first time getting here.
I'm currently creating a form toinsert data string into mysql database and uploading an image together. Image name must be saved in mysql DB and the file must be moved to a folder, let's name it "image/" folder.
I use jquery for inserting the data. Below is piece of code I've tried:
Form:
<form enctype="multipart/form-data" method="post" action="" id="formBerita">
<div>
Title:
<div><input type="text" id="title" name="the_title" placeholder="Your title here..." autocomplete="off"></div>
</div>
<div>
Content :
<div><textarea id="content" name="the_content"></textarea></div>
</div>
<div>
<input type="hidden" name="max_size" value="300000">
Image:
<div><input id="img" name="the_img" type="file" /></div>
</div>
<div>
<input type="button" id="btnSave" value="Save">
</div>
jQuery for inserting:
<script>
$(document).ready(function(){
$('#btnSave').on('click', function(){
var title = $("#title").val();
var content = $("#content").val();
var img = $("#img").val();
var dataContent = 'title='+title+'&content='+content+"&img="+img;
if(!title){
alert("You must fill the title!");
$("#title").focus();
}
else {
$.ajax({
type: "post",
url: 'includes/saveContent.php',
data: dataContent,
beforeSend: function() {
respon.contentColumn.append(respon.loader); //just loader before saving the data
},
success: function(datas) {
respon.contentColumn.find(respon.loader).remove();
}
});
}
});
});
</script>
saveContent.php file:
<?php
$title = $_POST['title'];
$content = $_POST['content'];
$img = $_POST['img'];
$query = "INSERT INTO tbl_content VALUES('','$title','$content','$img')";
mysql_query($query);
?>
So far, the above code works well. But, I'm still confusing how to upload and move the image file to a certain directory or folder using jQuery and PHP.
As we all know, generally in php we use:
move_uploaded_file($tempNama=$_FILES['fileName']['tmp_name'], $fileDestination);
for moving the image file to a destination folder.
So, the question: what should I add to complete my code so the image file can be uploaded and moved to a destination directory?
use this.
$targetDir = "D:\image_uploads";
if(is_array($_FILES)) {
if(is_uploaded_file($_FILES['img']['tmp_name'])) {
if(move_uploaded_file($_FILES['img']['tmp_name'],"$targetDir/".$_FILES['img']['name']))
{
echo "File uploaded successfully";
}
}
}
how to save image in folder but path name save in database in php
<?php
include("config.php");
if(isset($_POST['submit'])){
$folder = "upload/";
$imagefile = $_FILES["image"]["name"];
$temp = $_FILES["image"]["tmp_name"] ;
$wer = move_uploaded_file($temp,"$folder".$imagefile );
$query1="INSERT INTO employee (image) VALUES ('".$imagefile."')";
mysqli_query($conn,$query1);
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
<style type="text/css">
input[type=file]
{
width: 50%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 2px;
box-sizing: border-box;
}
div {
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}
</style>
<form method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="password" class="form-group">upload Image</label>
<input id="image" type="file" name="image" required="required">
</div>
<input type="submit" class="btn btn-default" value="register" id="submit"
name="submit">
</form>
</body>
</html>
On clicking the button magic1 or magic2, the div mybox will be updated with a text, button id and button (different for magic1 and magic2).
After clicking on the newly generated button it should display the button id of the newly generated button in the box div. When I click on the newly generated button, box div is not getting updated. Here is the code.
jquerycode.php is the initial file. On clicking the button magic1 or magic2, Ajax will call the page session.php.
jquerycode.php file
<!doctype html>
<?php
$first=$_POST['q'];
echo $first;
?>
<html>
<head>
<meta charset="utf-8" />
<title>My jQuery Ajax test</title>
<style type="text/css">
#mybox {
width: 300px;
height: 250px;
border: 1px solid #999;
}
#box {
width: 300px;
height: 250px;
border: 1px solid #999;
position: absolute;
right:210px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".magic_button").click(function() {
var data = $(this).attr('id');
//alert (data);
$.ajax({
type: "POST",
url: "session.php",
data: { 'id': data }
}).done(function(msg) {
$("#mybox").html(msg);
});
});
});
</script>
<script>
$(".fir").click(function() {
var dataa = $(this).attr('id');
alert ("hello");
$.ajax({
type: "POST",
url: "jquerycode.php",
data: { 'q': dataa }
}).done(function(msg) {
$("#box").html(msg);
return false;
});
});
</script>
</head>
<body>
The following div will be updated after the call:<br />
<div id="mybox">
</div>
<div id="box">
</div>
<form name="magic">
<!-- <label for="name" id="name_label">Name</label>
<input type="text" name="name" id="name" size="30" value="" class="text-input" />
<label class="error" for="name" id="name_error">This field is required.</label> -->
<input type="button" class="magic_button" name="magic_button" id="magic_button_1" value="magic1" />
<input type="button" class="magic_button" name="magic_button" id="magic_button_2" value="magic2" />
</form>
</body>
</html>
session.php file
<?php
$id = $_POST['id'];
$id = ucwords(implode(' ',explode('_',$id)));
if($id==="Magic Button 2")
{
echo "hey its button 2!!";
?>
<input type="button" name="butb" id="second" class="fir" value="second"/>
<?php
}
else
{
echo "hey its button 1!!";
?>
<input type="button" name="buta" id="first" class="fir" value="First"/>
<?php
}
echo $id;
?>
Best if you can use JQuery Live() for dynamic Generated Elements :
$("a.offsite").live("click", function(){ alert("Goodbye!"); }); // jQuery 1.3+
Beca JQuery Live() is deprecated you need to use JQuery on()
$("#elementid").on("click", function(event){
alert($(this).text());
});
Check out this link.
How is the code working out? I mean the src attribute of IFRAME is set to # then how does upload.php get to know that the form was submitted?
Here is the code : index.php :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Max's AJAX File Uploader</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript">
<!--
function startUpload(){
document.getElementById('f1_upload_process').style.visibility = 'visible';
document.getElementById('f1_upload_form').style.visibility = 'hidden';
return true;
}
function stopUpload(success){
var result = '';
if (success == 1){
result = '<span class="msg">The file was uploaded successfully!<\/span><br/><br/>';
}
else {
result = '<span class="emsg">There was an error during file upload!<\/span><br/><br/>';
}
document.getElementById('f1_upload_process').style.visibility = 'hidden';
document.getElementById('f1_upload_form').innerHTML = result + '<label>File: <input name="myfile" type="file" size="30" /><\/label><label><input type="submit" name="submitBtn" class="sbtn" value="Upload" /><\/label>';
document.getElementById('f1_upload_form').style.visibility = 'visible';
return true;
}
//-->
</script>
</head>
<body>
<div id="container">
<div id="header"><div id="header_left"></div>
<div id="header_main">Max's AJAX File Uploader</div><div id="header_right"></div></div>
<div id="content">
<form action="upload.php" method="post" enctype="multipart/form-data" target="upload_target" onsubmit="startUpload();" >
<p id="f1_upload_process">Loading...<br/><img src="loader.gif" /><br/></p>
<p id="f1_upload_form" align="center"><br/>
<label>File:
<input name="myfile" type="file" size="30" />
</label>
<label>
<input type="submit" name="submitBtn" class="sbtn" value="Upload" />
</label>
</p>
<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
</form>
</div>
<div id="footer">Powered by AJAX F1</div>
</div>
</body>
</html>
upload.php :
<?php
// Edit upload location here
$destination_path = getcwd().DIRECTORY_SEPARATOR;
$result = 0;
$target_path = $destination_path . basename( $_FILES['myfile']['name']);
if(#move_uploaded_file($_FILES['myfile']['tmp_name'], $target_path)) {
$result = 1;
}
sleep(1);
?>
<script language="javascript" type="text/javascript">window.top.window.stopUpload(<?php echo $result; ?>);</script>
The flow in this code is pretty simple if you follow the HTML form tag an it's related attributes. What is happening is the follwing:
Select upload
Submit form
The onSubmit() triggers a JS function which enables the loading.. visualization and disables the upload form. Because of the * return true* the form is still submitted.
The form submit is done into the iFrame because of the 'target=' attribute. With that action you make the iFrame source 'upload.php'
Upload.php is called from within the iFrame.
The Upload.php result calls the main window JS function 'stopUpload' which informs on the rest of actions to take.
This script will work although it's result might change cross browser. This is a good script for a fast AJAX upload implementation.
You have form action set to upload.php <form action="upload.php" hence when you submit upload.php knows form is submitted (if i understand your question correctly then above line is true)
Ok so here it is.
I have a index.php page. What it does is either make the html page or run a while loop.
It will only run the loop after you fill in some info and press a submit button on the html page. Now on the html page at the bottom i have it say "__ actions have been completed" with the blank being a variable that has 1 added to it each time the loop is run.
Now what i want to happen is that number to update everytime the loop is run. I have also been told to us ajax/jquery to do this but i have been unable to figure it out.
So what can i put in the while loop to have the variable update?
<?php
$number = $_POST['number'];
if(isset($number)){}
else{
$number = 0;
}
if(isset($_POST['Submit'])){
$MN = $_POST['MN'];
$count = $_POST['count'];
$provider = $_POST['provider'];
for ($i = 0; $i < $count; $i++) {
$m = rand(10e16, 10e20);
$n = base_convert(¤m, 10, 36);
$subject = $m;
$body = $n;
$number = $number + 1;
}
}
echo <<<END
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
<form action="$PHP_SELF" method="post">
<center> <p>
<label><b><big><big><big><big><big><big><big>Page</big></big></big></big></big></big></big></b></label>
</p>
<p>
<p>
<label><strong><u>MN</u></label>
</p>
<input name="MN" type="text" value=""/>
</p>
<p>
<p>
<label><strong><u>Number to Send</u></label>
</p>
<input name="count" type="text" value = "1"/>
<input name = "number" type = "hidden" value = "$number"/>
</p>
<p>
<p>
<label><strong><u>Provider</u></label>
</p>
<select name="provider">
<option value="">Choose One...</option>
</select>
</p>
<p>
<input name = "Submit" type = "submit" value = "Send"></a>
</p>
<p>You have done {$number} actions</p>
</center>
</body></html>
</style>
</head>
<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
color: #FF0000;
background-color: #000000;
}
.style7 {color: #FF0000}
END;
?>
What you could do, is use a session variable to record the number of times the user has completed the action.
if (!$_SESSION["times"]) $_SESSION["times"] = 0;
else $_SESSION["times"]++
Then in the HTML, output that variable.
i have modified your code so it can use jquery ajax to submit the form
the response is a json string , we parse it with jquery to get an javascript object
this your form code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
color: #FF0000;
background-color: #000000;
}
.style7 {color: #FF0000}
</style>
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("#Submit").click(function(){
$.ajax({
url:"process.php",
type:"get",
data:$("form").serialize(),
success:function(response){
var obj = jQuery.parseJSON( response );
var success = obj.success;
var actionsNumber = obj.number;
$("#result").html('You have done '+actionsNumber+' actions');
}
})
})
})
</script>
</head>
<body>
<form action="" method="post">
<center> <p>
<label><b><big><big><big><big><big><big><big>Page</big></big></big></big></big></big></big></b></label>
</p>
<p>
<p>
<label><strong><u>MN</u></label>
</p>
<input name="MN" type="text" value=""/>
</p>
<p>
<p>
<label><strong><u>Number to Send</u></label>
</p>
<input name="count" type="text" value = "1"/>
<input name = "number" type = "hidden" value = "$number"/>
</p>
<p>
<p>
<label><strong><u>Provider</u></label>
</p>
<select name="provider">
<option value="">Choose One...</option>
</select>
</p>
<p>
<input id="Submit" type = "button" value = "Send">
</p>
<p id="result"></p>
</center>
</body></html>
and the code of process.php :
<?php session_start();
// process your form data as you do
//:::::::::
//
if(!isset($_SESSION['number'])){
$_SESSION['number'] = 0;
}
$number = $_SESSION['number']++;
// output json response
echo'{"success":"true","number":"'.$number.'"}';
?>
we store the number in the session and increment it every action ( call of process.php)
and update the paragraph id="result" with the response.number
hope that help
What you want to do isn't possible (well, not in the way you think).
If I had to do this as an absolute requirement (even though it stinks of poor design) I would do it like so:
Wherever your number is in the original output file, wrap it in a div or span and give it a unique id.
I would then use a session variable for your loop counter.
Finally, I would use jQuery with the timers plugin to fire off at 1 or 2 second intervals. Within the timer, you should call a .php file in the background that simply returns the value of the session variable.
Here's a bit of code to demonstrate:
(Edited to clarify based on comments below)
Here is a working example:
<?php
// main_page.php
session_start();
$_SESSION['loop_count'] = 0;
?>
<html>
<head>
<title>Background Updating Example</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="PATH_TO_YOUR_SCRIPTS/timers.jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: 'exec_loop.php',
success: function(data) {
$('#status_message').html("Loop started...");
}
});
$(document).everyTime(1000, function() {
$.ajax({
url: 'get_counter.php',
success: function(data) {
$('#counter_text').html(data);
}
});
});
});
</script>
</head>
<body>
The loop has executed <span id='counter_text'>0</span> times.
</body>
</html>
Then in the get_counter.php file, just do something like this:
<?php
// get_counter.php
session_start();
echo $_SESSION['loop_count'];
?>
Now for the loop file
<?php
// exec_loop.php
session_start();
for ($i = 0; $i < 50000000; $i++) {
$_SESSION['loop_count']++;
}
?>
Save these three files, and you'll get the result you desire.