Hi there

I have a page that has php code at the top. Ajax before the body tag and a form.
I need to be able to call a php function (the one at the top of my page) that adds info from the form into the DB. Normally I'd do this in the traditional sense of "if($_REQUEST('submit')" but I have a jquery progress bar that works with ajax to request progress data from the server. The following code is the code that retrieves the data from the server:

if (@$_GET['id']) {
	echo json_encode(uploadprogress_get_info($_GET['id']));
	exit();
}

This as you can see executes repeatedly till the upload is finished. The problem is I can't incorporate my database insertion code with this because the progress bar stops working altogether.

If you know how to call a php function with ajax could you please supply an example or link. I'd really appreciate it.

This is the page I'm working with. I've taken out all the unnecessary code.

<?php
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");

$ulid = uniqid();

if (@$_GET['id']) {
	echo json_encode(uploadprogress_get_info($_GET['id']));
	exit();
}

function DBinfo()
{
	//all the code and variables required for inserting the form info into the database	
}

?>
<!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</title>
<script type="text/javascript" src="include/jquery-1.2.6.js"></script>
<script type="text/javascript" src="include/jquery.progressbar.js"></script>
<script>
var progress_key = '<?= $ulid ?>';

// this sets up the progress bar
$(document).ready(function() {
	$("#uploadprogressbar").progressBar({barImage: 'images/progressbg_red.gif'});
});

// fades in the progress bar and starts polling the upload progress after 1.5seconds
function beginUpload() {
	$("#uploadprogressbar").fadeIn();
	setTimeout("showUpload()", 1500);
}

// uses ajax to poll the uploadprogress.php page with the id
// deserializes the json string, and computes the percentage (integer)
// update the jQuery progress bar
// sets a timer for the next poll in 750ms
function showUpload() {
	$.get("index.php?id=" + progress_key, function(data) {
		
		if (!data)
			return;

		var response;
		eval ("response = " + data);

		if (!response)
			return;

		var percentage = Math.floor(100 * parseInt(response['bytes_uploaded']) / parseInt(response['bytes_total']));
		$("#uploadprogressbar").progressBar(percentage);
				
	});
	setTimeout("showUpload()", 750);
	
}
</script>
</head>

<body>
<form name="upload" method="post" id="uploadform" action="" enctype="multipart/form-data" onsubmit="beginUpload();">
<input type="hidden" name="UPLOAD_IDENTIFIER" id="progress_key" value="<?= $ulid ?>" />

<!--Table with form elements and submit button go here-->

</form>
</body>
</html>

There was one line I accidently deleted in the code above which was the progress bar.

<span class="progressbar" id="uploadprogressbar">0%</span>

This line can be anywhere in between the body tags

I managed to solve my problem!

I simply changed "function DBinfo()" to an if statement as follows:

if($_FILES['uploadFile']['tmp_name']) {     //uploadFile being the name of my file input in my form

This made my db code run once a temporary file had been uploaded onto the server by the user.

To use jAPI in your project you will have to fallow a few steps only.

First download jAPI project source from this address.

Make sure that you included in your html page all scripts properly. You also have to include this two scripts in your html file: jAPI.js, jAPI-Remote.php.

jAPI-Remote.php actually can be any php script from which you want to use their server side methods.

You have to include jAPI-Core.php script in this file (jAPI-Remote.php) by adding this line of code at the beggining of your script:

include("httpHandler/jAPI-CORE.php");

And at the end of your script you will have to create a new instance of jAPI Base Class like this:

//all classes names comma separated as jAPIBaseClass parameter which you want to use

new jAPIBaseClass('YourClass,AnotherClass');

So, that's it!

Don't hold your breath waiting for a thank-you.
This thread was even older than the other one, having been dead for just under two years; plus, it had been marked solved.

This question has already been answered. Start a new discussion instead.