Oxyscripts - PHP Development, tutorials, articles, news, programming, scripts and forums.

AJAX without XMLHTTP

By admin (2006-11-04. 4199 views.)

I have a client that has their own version of IE installed in their large user base (I think this is very typical of large corporations). While they have JavaScript running, they have removed the XMLHTTP object. So, how do you do AJAX without XMLHTTP?

The basic idea is to use the document model to 'add' the remote script result to the current document.

On the client side, we have a page that looks like:


<?php


<html>

<head>

<!-- engine.js -->

<!-- this would normally be in an included script -->

<script language='javascript'>



// Get base url

url = document.location.href;

xend = url.lastIndexOf("/") + 1;

var base_url = url.substring(0, xend);



function ajax_do(url) {

    // Does URL begin with http?

    if (url.substring(0, 4) != 'http')

        url = base_url + url;



    // Create new JS element

    var jsel = document.createElement('SCRIPT');

    jsel.type = 'text/javascript';

    jsel.src = url;



    // Append JS element (therefore executing the 'AJAX' call)

    document.body.appendChild(jsel);

}



function myfunction() {

    ajax_do("/remote/testnewremote.php");

}    



function callback(result) {

    alert(result);

}

</script>

</head>

<body>

This page is running a test of AJAX without using the XMLHTTP object.

<input type="button" onclick="javascript:myfunction()" value="Click Here to Test">

</body>

</html>


?>

So, the code first grabs some information about the environment so it can correctly access remote pages later on. The client-side page just displays a clickme button. Once clicked the work starts.

The meat of the code is in the ajax_do() function. This function builds the correct URL to the remote script and just adds it to the current web document! So, if you use your imagination a little you can see that we could add all kinds of args to the URL that we include or we could call predefined functions in the loaded 'page' very easily or ...

When the remote script is loaded by the browser it is executed, obviously. The neat part is the remote script can have server side scripting that runs first and client side script used to retrieve the results of the server side script.

For this example I have the remote script automatically call a predefined client side function with the result. The point is to make sure that the server side script has completed before we attempt to grab the results.

The server side page is very simple (for this example):


<?php


<!-- remote page-->

<?php

$result = "whatever i want";

?>

callback('<?php echo result; ?>');


?>

Use your imagination on what actually happens in the server side scripting. We could also have different callbacks used.

Thanks to an article at phpit (http://www.phpit.net/article/ajax-php-without-xmlhttprequest/) Their article used a div tag to pass information back to the client. I think div tags are a bad idea due to their affecting screen painting and not sure if they are really cross browser supported.

I changed the model to use a callback function instead. This guarantees that the remote script has completed BEFORE you attempt to grab the results.

There is a note that this all requires less than the HIGH security setting in IE. Unclear what part of this breaks that model.