PHP AJAX loading please wait message

Hi,

I am new to ajax and need some help on how to add a Loading... Please Wait message.

I have a PHP script that once the user hits submit a remote execution is run on the server

exec('C:\test\psexec.exe -d schtasks /RUN /TN "Test"');

I know how to check if the exe is still running on the server using

exec ('tasklist /FI "IMAGENAME eq psexec.exe"');
However I want to be able to display a message while a script checks every 10 seconds if the exe is still running.

Thanks
kev8326Asked:
Who is Participating?
 
kev8326Connect With a Mentor Author Commented:
Hi,

I was able to follow this link to resolve my issue and add ajax that auto refreshed.

http://www.aleixcortadellas.com/main/2009/02/11/232/ 
0
 
theodorejsalvoCommented:
Are you taking advantage of the readyState in your AJAX function?  If so, you could use the waiting state ("if(readyState == 2 || readyState == 3)") to run your exec ('tasklist /FI "IMAGENAME eq psexec.exe"'), and parse your output to display a message.

This code would go right above where you hand the returned ajax call (typically "if(readyState == 4)" << this line)

If you want to post your AJAX request code, I can show you where to put the insert.
0
 
kev8326Author Commented:
Hi,

I dont have any ajax in my script as its currently all php. If you need I can show you that?
0
Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

 
theodorejsalvoCommented:
I'm not sure how much you know about AJAX, so forgive me if you know this already.

In short, AJAX is a way to load content inside a page without reloading the whole page.  This requires both the client (browser: IE, firefox, chrome) and the server (where you php code is executed) to work together.  A typical AJAX setup uses PHP for the serverside and javascript for the client side.

I'd rather send you to a tutorial with samples for the AJAX code.  When I first started with AJAX, I started with sample code and evolved it from there.  It's actually a handy little snippet to keep around.

This is a good learning tutorial for AJAX (IMHO): http://www.xul.fr/en-xml-ajax.html
0
 
Marco GasiFreelancerCommented:
I did exactly the same thing you are trying to do. I had a form to insert product to buy into an order. In the onclick event a javascript function were called. This function did an Ajax call, but before this, it called another function, named ShowDialog() in wich I used Dojo to show a 'Please wait...' dialog with the classic flash-like animation.
So you have to write following lines in head section

<script type="text/javascript">
  var djConfig = {
    baseScriptUri : "../shared_scripts/dojo1.3.2/",
    parseOnLoad : true
//        extraLocale: ['en-us']
  };
</script>
<script type="text/javascript" src="../shared_scripts/dojo1.3.2/dojo/dojo.js"></script>
<script language="JavaScript" type="text/javascript">
  dojo.require("dijit.Dialog");
</script>

Then, in your page in wich you want to show the dialog write something like this

                <div dojoType="dijit.Dialog" id="pleaseWaitDialog" title="Attendere, prego..."
                     style="display:none;width:200px;">
                    <p align="center" id="AttendereText"><img src="scripts/dojo1.3.2/dijit/themes/tundra/images/treeExpand_loading.gif" width='20' height='20' alt='Lavoriamo per voi...' /></p>
                </div>

Finally, the ShowDialog() function to call before to do Ajax call:

function showDialog(){
    dijit.byId('pleaseWaitDialog').show();
}

And the function to call after Ajax call (using onComplete parameter):

function hideDialog(){
    dijit.byId('pleaseWaitDialog').hide();
}

This will work fine

Regards
0
 
kev8326Author Commented:
Hi,

I've added my code as I'm confused as to how I add this feature.

Here is the order of steps to process.
1. Users types search string
2. User hits submit
3. On submit a search is done and a exe is now running on the local server processing results. Its at this stage I want a "Please Wait" dialog and once the exe has ended to then show a message that "Processing has Completed"


<html>
<head>
</head>
<?php

if (isset($_POST['submit'])) {

	// extra code that writes search results to a file on server


	//Now execute task on server

	exec('C:\test\psexec.exe -d schtasks /RUN /TN "Test"');

}



?>




<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST" > 

<table>
	<tr>
		<td><input type=text name="asset" size="20" value="<?php if(isset($_POST['asset'])) echo $_POST['asset'];  ?>"</td><td></td>
	</tr>
	<tr>
   	<td colspan="2"><input type="submit" name="submit" value="Search" > </td>
   </tr>
   </table>

</form>
</html>

Open in new window

0
 
Marco GasiFreelancerCommented:
Sorry for uncompleted answer. To use my solution you have to use the DOJO library. You can find it here: http://www.dojotoolkit.org/download/

Regards
0
 
Marco GasiFreelancerCommented:
I'm going to study your code: I'll come back soon.
0
 
Marco GasiFreelancerCommented:
Looking at your coe, I've seen that there is any Ajax call. I have a doubt: does the program that perform the server task  have a result? Where this result will be printed? In this case, I can suggest to do an Ajax call and I'll explain you how to do it. But to do it, it's necessary that you can print program output in a specific div of your page.
If server program has no result, we have to detect when this program end its task. In this case, you can change form action to a waiting.php page within you call server program and when search is completed you add a header(Location: original_page.php) to exit from tha waiting page and redirect user to the original page. Hope have been understandable...
0
 
kev8326Author Commented:
Hi

I had a thought and what I need is a way to dynamically show this code below. However instead of text it to show please wait

function tasklist() {
	
	sleep(5);
	
	$test = exec ('tasklist /FI "IMAGENAME eq mstsc.exe"');
		
	if (empty($test)) {

		echo "No process running";
	}
	else {
		echo "Process Running";
		tasklist();
	}
	
	return $test;
}

Open in new window

0
 
Marco GasiFreelancerCommented:
The problem seems to be that you wish call a javascript function from within a php function. Unfortunately, this isn't possible. My suggestion is to do something like

Have a page with the form without any action. When user click submit button (onclick=""myAjax();) a javascript function is called

function MyAjax(){
    showDialog();
    var updater = new Ajax.Updater('testdiv', 'tasklist_page.php', {
         method: 'get', insertion: 'bottom', onComplete: function() {hideDialog();}
    });
}

In this way, $test returned by php function will be printed in testdiv. Probably you have to clear the conditional statements about 'No process running" and "Process Running".

Hope this helps
0
 
kev8326Author Commented:
I thought i'd try something simple first just to get the DIV to refresh on a time interval however my code doesnt work. Can you help?
Thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function TimerTest()
{
	//for other browsers
	req = new XMLHTTPRequest();
	//for ie
	//req = new ActiveXObject("Microsoft.XMLHTTP");
	if (req != null)
	{
		req.open("GET", test4.php, false);
		req.send();
		if (req.responsetext != '')
		{
			divtag = document.getElementById('TestDiv');	
			divtag.innerHTML = req.responsetext;
		}
		else
			alert('error');
	}
	var t=setTimeout("TimerTest();",3000);
}



</script>
</head>
<body onload="TimerTest();">
<div id="TestDiv">
<?php echo include('test3.php'); ?></div> 
</div>
</body>
</html>

Open in new window

0
 
Marco GasiFreelancerCommented:
I'm not a javascript ninja, but I think you shouldn't call setTimeout in the same function that setTimeout calls. Maybe, you would call setTimeout in onload event and stopping it req.responsetext != '', but I think this is more complicated than doing what I suggested. About this, I forgot to say that you have to add these lines in the script file or in head section of your page

function addObservers() {
    $('form_code').observe('submit', orderProduct);
}
Event.observe(window, 'load', addObservers);

But is not so complex, uh?...
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.