The Server-Side Handler

The server-side portion of our example is where the real benefit of this technique over the more simplified technique will be shown. Essentially, the old technique allowed only one type of RPC call per Sitellite box, which was good for very limited use, but for extensive use it's best to add a little bit of organization to our code.

The new RPC handler action can be written as follows:

<?php

loader_import ('saf.Misc.RPC');

class Calculator {
	function add ($v1, $v2) {
		// input validation
		if (! is_numeric ($v1) || ! is_numeric ($v2)) {
			return false;
		}

		return $v1 + $v2;
	}

	function sub ($v1, $v2) {
		// input validation
		if (! is_numeric ($v1) || ! is_numeric ($v2)) {
			return false;
		}

		return $v1 - $v2;
	}

	function mult ($v1, $v2) {
		// input validation
		if (! is_numeric ($v1) || ! is_numeric ($v2)) {
			return false;
		}

		return $v1 * $v2;
	}

	function div ($v1, $v2) {
		// input validation
		if (! is_numeric ($v1) || ! is_numeric ($v2)) {
			return false;
		}

		return $v1 / $v2;
	}

	function mod ($v1, $v2) {
		// input validation
		if (! is_numeric ($v1) || ! is_numeric ($v2)) {
			return false;
		}

		return $v1 % $v2;
	}
}

echo rpc_handle (new Calculator (), $parameters);
exit;

?>

Each function on the server is organized as a separate method of our Calculator object, which allows for much more complex RPC uses in a much more coherent fashion. Our example is arguably a little over-simple, but you get the idea.

Client-Side Code Organization

Let's revisit our Javascript on the client-side for a moment to see how we can also increase complexity there while keeping things organized an manageable. First, we'll add a new button to our HTML form code like this:

<input type="submit" value="Clear" onclick="return calculator.clear (this.form)" />

All that's needed to create this additional functionality is to add another method to our calculator object:

var calculator = {
	url: ...
	action: ...

	calc: function (f) {
		...
	}

	clear: function (f) {
		f.elements.v1.value = "";
		f.elements.v2.value = "";
		document.getElementById ('answer').innerHTML = "";
		return false;
	}
}

All we've done here is to empty the values we had previously entered, and clear the answer as well, and we were able to do it in its own isolated method separate from the rest of our code, making it a highly reusable technique for building complex AJAX applications.

Page 1: Note: An introduction to this to...
Page 2: The Server-Side Handler
Page 3: Automating Client Operations

Home   More Applications Stories