Tim is a terrific programmer with great communication skills.
License Agreement
Now supports JSON for fast communication!
tppAJAX is a lightweight, yet feature-rich PHP and Ajax toolkit that is compatible with PHP versions 4 and 5 (PHP 5.2 required for JSON).
No need to learn new server side techniques - tppAJAX sends information to your PHP scripts the way you're already used to: using $_GET and $_POST!
And sending a response back to your web page is as simple as using a few tppAJAX PHP functions - full PHP source is provided! The client-side API allows you to send simple requests or entire HTML forms to the server invisibly, behind the scenes, without having to refresh the entire page. This is the "magic" of Ajax. This request is sent and the results are received and processed automatically. Multiple connections can be communicating at any one time - tppAJAX utilizes connection pooling.
The server-side is a light-weight PHP solution that allows you to specify three different types of data to send back in response to a request.
- HTML content to be placed into containers specified by ID's in the HTML tags
- Properties to set on the document object
- Javascript Code to execute
License Agreement
Code Examples
The sortable list
<?php
$demo2Title = 'Shopping List Demo';
// This is used by www.ThePhpPro.com for our internal template structure.
// it is not relevant to your code, although you will need to make sure these
// scripts are included in your html source.
$scripts[] = '/js/ajax.js';
$scripts[] = '/js/prototype.js';
$scripts[] = '/js/scriptaculous.js';
define( 'NO_TESTIMONIALS', true );
$styleSheets[] = '/css/ajaxDemo.css';
$list[100] = 'Eggs';
$list[400] = 'Flour';
$list[500] = 'Milk';
$list[210] = 'Juice';
$list[4200] = 'Bread';
$list[55] = 'Butter';
require_once( 'data/tppAJAX.php' );
// called at the top of our demo template file - detects an AJAX request using $_GET['shoppinglist']
// and returns the AJAX response using tppAJAXGenerate
function demoStart()
{
global $list;
if ( isset( $_GET['shoppinglist'] ) )
{
tppAJAXStartResponse();
for ( $ix = 0; $ix < 7; $ix++ )
{
$newList[] = $list[$_GET['shoppinglist'][$ix]];
}
$pieces['ajaxOutput'] = implode( ', ', $newList );
// show the structure of the list sent by scriptaculous
ob_start();
var_dump( $_GET['shoppinglist'] );
$structure = ob_get_contents();
ob_end_clean();
ob_start();
var_dump( $list );
$listStructure = ob_get_contents();
ob_end_clean();
$pieces['varDump'] .= '<pre>';
$pieces['varDump'] .= '<br />The text output of the list<br /> ' .
implode( ' <br /> ', $newList );
$pieces['varDump'] .= '<br />The list structure sent from scriptaculous:<br />' .
$structure;
$pieces['varDump'] .= '<br />Our internal list structure (never changes) :<br />' .
$listStructure;
$pieces['varDump'] .= '</pre>';
echo tppAJAXGenerate( $pieces );
exit();
}
}
// called from the body section of the demo template file.
// this creates the HTML for the unordered list and list items that make up the sortable list
function demoBody()
{
global $list;
?><div id="varDump" style="float:right; border-left: 1px solid black;"></div>
This plain text list is generated on the server.
It is updated from the server via tppAJAX each time the list changes.
<div id="ajaxOutput"><?
// display the initial list
echo implode( ' ', $list );
?></div>
<ul id="shoppinglist">
<?
foreach ( $list as $id => $value )
{
// the id of the LI element needs to be an ID generated by your script
// I would recommend using a database ID number
// or some other internally generated ID number that
// you can track programatically
// it is this number that is sent to the AJAX processing script
?>
<li id="TLID_<?= $id; ?>"><span style="float: right;"><?= $value; ?></span>
<img height="40"
src="/images/demo/ajax/<?= strtolower( $value ); ?>.jpg" alt="<?= $value; ?>"/></li>
<?
}
?>
</ul>
<?
// see the documentation on scriptaculous for the options
// that can be used when creating a sortable
$listOptions['constraint'] = 'false';
// This is a PHP wrapper function that hides the javascript necessary
// to create the sortable list
// and it also creates a small javascript function that executes the
// AJAX update when the list is updated
// The parameters are: The ID of the UL, The options sent to the
// sortables create function, And the PHP AJAX handler
tppAJAXRegisterList( 'shoppinglist', 'demo2.php', $listOptions );
?>
View <a href="example.php">example code.</a><br />
<?
}
?>
The CSS for the sortable list
#shoppinglist
{
list-style-type:none;
margin:0;
padding:0;
}
#shoppinglist li
{
width:150px;
margin:8px;
margin-left:15px;
padding:5px;
cursor:move;
border: 1px solid black;
background: #CCC;
}
#ajaxOutput
{
font-size: 1.5em;
color: red;
}
The code for checking username availability
<?php
ini_set( 'session.use_trans_sid', false );
ini_set( 'url_rewriter.tags', '' );
ini_set( 'session.use_cookies', true );
ini_set( 'session.use_only_cookies', true);
ini_set( 'session.name', '5E2JEA901A8C5B12CD43' );
session_set_cookie_params( 0 );
session_cache_expire( 1440 );
session_start();
require_once( 'tppAJAX.php' );
tppAJAXStartResponse();
$pieces = array();
$doc = array();
$js = array();
// for this example we simply keep track of the usernames someone has already typed in
// and reply Unavailable if the name has already been typed in.
// in practice, you would need to take the name that is sent in via $_REQUEST['username']
// and do a query
// something like
// $result = mysql_query( "SELECT COUNT(ID) FROM USER WHERE USERNAME = '" .
// $_REQUEST['username'] . "'" );
// if the value from the query > 0 then the name is unavailable
if ( is_array( $_SESSION['usernames'] ) &&
in_array( $_REQUEST['username'], $_SESSION['usernames'] ) )
{
$message = 'Unavailable';
$color = 'red';
}
else
{
$message = 'Available!';
$color = 'green';
$extraCss = 'font-weight: bold;';
$_SESSION['usernames'][] = $_REQUEST['username'];
}
$doc['title'] = $message;
// ignore this line. :)
//$highlights['check_user_result'] = '#FFCCAA';
$pieces['check_user_result'] = '<span style="color: ' .
$color . ';' . $extraCss . '">' . $message . '</span>';
if ( $_REQUEST['show_alert'] == "X" )
{
$js[] = "alert('" . $message . "');";
}
// just for kicks, let's send back the names they've entered.
ob_start();
?>The usernames in your session are<br /><?
echo @implode( '<br />', $_SESSION['usernames'] );
?>
<a style="cursor: pointer; font-color=blue; text-decoration: underline;"
onclick = "document.getElementById('var_dump_results').innerHTML = ''; ">[Hide]</a>
<?php
$pieces['var_dump_results'] = ob_get_contents();
ob_end_clean();
echo tppAJAXGenerate( $pieces, $doc, $js, $highlights );
?>
The code for checking for mailing list signup
<?php
ini_set( 'session.use_trans_sid', false );
ini_set( 'url_rewriter.tags', '' );
ini_set( 'session.use_cookies', true );
ini_set( 'session.use_only_cookies', true);
ini_set( 'session.name', '5E2JEA901A8C5B12CD43' );
session_set_cookie_params( 0 );
session_cache_expire( 1440 );
session_start();
require_once( 'tppAJAX.php' );
tppAJAXStartResponse();
$pieces = array();
$doc = array();
$js = array();
// for this example we simply keep track of the names and emails someone has already typed in
// and remove the form upon success or show an error if a field is blank
// or show "already registered" if the name and email has already been typed in.
// in practice, you would need to take the data from the form
// and do a query on a database
$name = trim( $_REQUEST['name'] );
$email = trim( $_REQUEST['email'] );
if ( trim( $name ) != '' && trim( $email ) != '' )
{
if ( is_array( $_SESSION['mailListName'] ) &&
in_array( $_REQUEST['name'], $_SESSION['mailListName'] ) )
{
$pieces['signupDemo'] = 'You are already registered';
}
else
{
$_SESSION['mailListName'][] = $_REQUEST['name'];
$pieces['signupDemo'] = 'Registration Successfully Completed.';
$js[] = "document.getElementById('signupDemo').style.fontSize = '18pt';";
}
}
else
{
if ( $name == '' && $email == '' )
{
$pieces['mailListDemoError'] = 'Name and Email may not be left blank.';
}
elseif ( $name == '' )
{
$pieces['mailListDemoError'] = 'Name may not be left blank.';
}
else
{
$pieces['mailListDemoError'] = 'Email may not be left blank.';
}
//$highlights['mailListDemoError'] = '#FF0000';
}
echo tppAJAXGenerate( $pieces, $doc, $js, $highlights );
?>
The initial HTML with Javascript code for the page
<!-- don't forget to include your javascript tag to load the ajax.js file -->
<!-- on our web site, www.ThePhpPro.com, our web site template takes care of this automatically -->
<p class="pageSection">AJAX Username Availability Check</p>
<p>This shows how an AJAX enabled web page might utilize tppAJAX to
check for the availability of a particular username. For this
simple demo, usernames are stored per browser session. In practice, on a production web site,
the <a href="example.php">example code</a> would actually check a
database for the availability. Watch title bar change as you check availability
</p>
<div id="rs"></div>
<form onsubmit="clearElement( 'check_user_result' );
sendForm('signupForm','data/checkUsername.php');return false;"
id="signupForm" action="index.php">
<p>
<input type="text" name="username" />
<a href="javascript://"
onmousedown="clearElement( 'check_user_result' )"
onclick="sendForm('signupForm','data/checkUsername.php')">Check Availability</a>
<span id="check_user_result"></span><br />
Show Alert Also<input type="checkbox" name="show_alert" value="X" />
Male:<input type="radio" name="R1" value="MALE" />
Female: <input type="radio" name="R1" value="FEMALE" />
</p>
</form>
<div id="var_dump_results">
</div>
<hr />
<p class="pageSection">AJAX Mailing List Signup</p>
<p>This shows how an AJAX enabled web page might utilize tppAJAX to allow a
user to sign up for a mailing list without leaving the page.
This only checks the name, not the email to see if it's already been registered.<br />
Once again, this is only stored for the browser's session.</p>
<div id="signupDemo">
<span id="mailListDemoError" style="font-weight: bold; color: red;"></span>
<form onsubmit="sendForm('mailListDemo','data/mailListDemo.php');return false;"
id="mailListDemo" action="index.php">
<p>
Name <input type="text" name="name" />
EMail <input type="text" name="email" />
<input type="submit" value = "Signup" />
</p>
</form>
</div>
Features
- New feature! Send data back to your script using JSON!
- Built in JSON XSS protection!
- Now Integrated with Scriptaculous! Check out the sortable list demo!
- Works in the newest browsers from Microsoft and Mozilla and in Linux web browsers too!
- tppAJAX supports true form submissions - variables available in $_POST using PHP
- Includes robust Javascript interface to the xmlHttpRequest object
- Lightweight easy-to-use PHP code generates output for Ajax interactions
- Architecture encourages business logic to remain on the server not where hackers can see it.
- Multiple connections can be communicating at any one time with connection pooling!
- Actively being developed (I use it in my own projects!) - not some dead-end code
For web site hosting I recommend - www.bluehost.com