Examples - SS.net - $load() Function

This example aims to show you how to use one of the corner stones of the Spiderscript library. $load() is a refined global function to the SS.net.load() static class function. This is essentially a wrapper for the essence of the Spiderscript AJAX library facilitating the ability to asynchronously request web resources without having to refresh the current browser page.

Please visit the documentation for SS.net for detailed specifications.

Documented Function Call:-

$load(url : {string},
	param : {object},
	onload : {function},
	onerror : {function},
	ontimeout : {function},
	timeout : {int},
	nocache : {boolean});


or

$load(parameter_object : {object});


Example 1: Static XML File - Basic call

This example will use the a very simple static XML document called htmlcolors.xml.


To download this document, simply call the $load() function in your Javascript code as shown below:-

$load("htmlcolors.xml");

//OR THIS COULD BE WRITTEN AS

$load({url : "htmlcolors.xml"});

Example 2: Static XML File - Calling a function after the resource has loaded

Example 1 will request the static XML document using the GET method but as no parameters have been specified, the call will do very little. The next stage is to define functions as parameters to $load() that will be called when the resource loads, is in error or times out.

The three function parameters to $load() are:-

onload - fires after the the resource has been successfully requested.
onerror - fires is there is an error during the requesting of the resource.
ontimeout - fires if the request for the resource takes longer than the allocated time. After this function is fired, the onerror function will also be fired.

$load("htmlcolors.xml",null,hasLoaded,hasErrored,hasTimedout);

//OR THIS COULD BE WRITTEN AS

$load({url : "htmlcolors.xml", onload: hasLoaded, onerror: hasErrored, ontimeout: hasTimedout});


N.B. The brackets are deliberately missing from hasLoaded, hasErrored and hasTimedout functions as the function reference needs to be passed through to $load(). Using the brackets at this point will cause the function to be evaluated and the returned result would be passed as an argument through to $load().

Example 3: Static XML File - Accessing the returned document

From Example 2, we now have three functions that are called depending upon the result of loading the specified resource. The functions defined above are called in the context of the SS.net.requestor object which has loaded the document. To access what has been returned, use this.req which is the XMLHttpRequest object that the document has been loaded with. The returned content is accessed using this.req.responseText and if the response type was an XML document, this.req.resposneXML. E.g. 

function hasLoaded()
{
 var request = this.req;  //Get XMLHttpRequest object
 
 var responseText = request.responseText; //Text content returned
 var responseXML = request.responseXML;  //XML content returned. Is null if response content type is not "text/xml"
 
 if(responseXML)
 {
  alert("XML Document Returned");
 }
 else if(responseText)
 {
  alert("Text Document Returned");
 }
 else
 {
  alert("No document content was returned.");
 }
 
}

Example 4: POSTing data to the server

The second parameter of the $load() function takes an object parameter.

E.g. 

$load("request.asp",{param1 : value1, param2 : value2});
or

$load({url : "request.asp", param : { {param1 : value1, param2 : value2} });

Whenever the param parameter is specified, the asynchronous request is sent to the server using the POST method. This makes the values accessible as form parameters.

E.g.

var v1 = Request.Form("param1");
var v2 = Request.Form("param2");


would mean that v1 = "value1" and v2 = "value2".

 Obviously the code will above will differ depending upon the server-side language being used.

Documentation
SS.net