Embeddable Applications

Raxan makes it possible to embed an Ajax application within another web page or application. With embeddable apps developers can use Raxan to extend or enhance their existing web pages without having to make any major changes or convert or port the entire web page to into PHP.

Other Benefits:

1. Embeddable apps can be used with static or dynamically generated web pages such as those generated by other languages such as Perl, JSP, ASP, ASP.Net, Ruby, Python, etc.
2. They can also be used to manipulate and traverse the client-side DOM elements within a web page. This means that an application can be designed to add or remove elements as the user interacts with the web page.

Creating an embedded application is the same as creating a typical Raxan for PHP Ajax web page. The one thing to bear in mind is that the application will only communicate with the client's browser via Ajax after first load. Full page post-backs are not recommended for embedded applications.

Emebedded Hello World app

This will add a button to the web page and will then display the 'Hello World' message when the button is clicked.

<?php 
    require_once("raxan/pdi/autostart.php");

    class EmbeddedApp extends RaxanWebPage {
        protected function buttonClick(){
            // use the CLX to sent and alert action script to the client
            c()->alert('Hello World!!! - PHP Rules!');
        }
    }
?>
<button id="button" xt-bind="#click,buttonClick">Click Me!</button>

To load the above application inside your web page you only need to add a single script tag with the ?embed[js] query string as shown below:

<script type="text/javascript" src="hello.php?embed[js]"></script>

Using the above you can pass special instructions to the app to prevent it from loading external CSS or JavaScript files:

<script type="text/javascript" src="hello.php?embed[js]=noxcss,noxjs"></script>

The noxcss option will prevent the loading of all external css files, while noxjs will prevent the loading of all external JavaScript files. These options will come in handy if you have already loaded a specific script of css file.

Sending Content To The Client

The appendToClient(), prependToClient, replaceClient() and updateClient() methods provide a convenient way for developers to transfer DOMs elements from the server to the client. Let's say you wanted to create a div on the server and then add the div inside an element called "sidebar", here's how it could be done in a single line:

<?php
    $div = $this['<div id="box1" class="box" />'];
    $div->appendToClient('#sidebar');
?>

You can also use the c() function to make jQuery calls from the server. For example: c('#sidebar')->html('This is a message from PHP');

Up Next: Creating Degradable Web Pages