OBOUT - Free AJAX Page - How It Works

AJAX Page - How It Works

OboutInc.oboutAJAXPage namespace

Your page must be derived from OboutInc.oboutAJAXPage.

If you are using pages without code behind, add the next line on top of your aspx page:
<%@ Page Language="C#" Inherits="OboutInc.oboutAJAXPage" %>

If you are using pages with code behind, derive your page like this:


        public class PageName : OboutInc.oboutAJAXPage

where PageName is the name of your page.

How It Works

Client scripts can call server-side methods with parameters using post method.
You can add an indefinite number of parameters using the AddParam method, or using the post method.
The parameters you add must have a correspondent on the server-side method that manipulates the data.
The server-side method needs to be declared public.

                
        // using AddParam
        ob_post.AddParam("param1", paramValue1);
        ob_post.AddParam("param2", paramValue2);
        ob_post.post(null, "myServerMethod", myFunction);
                
        // using post
        ob_post.post(null, "myServerMethod", myFunction, {"param1":paramValue1, "param2":paramValue2});

For more information please check post method documentation.
See also: AddParam tutorial.

Server side methods can trigger a client-side function.

Before the processing starts using ExecBeforeLoad.
After the processing is over using ExecOnLoad.

                
        ExecBeforeLoad("myFunction1()");
                
        ExecOnLoad("myFunction2()");

Send back a response to the client after the server-side processing is finished.

Return values from the server-side methods
Use the server side methods ExecBeforeLoad and ExecOnLoad.

        
        public string onEdit(string sNewValue, string sOldValue)
        {
            // process the information
            // .....
            return sOldValue + " was replaced with " + sNewValue; // response returned to the client
        }
                
        ExecBeforeLoad("customJsFunction(" + customValue.ToString() + ")");
                
        ExecOnLoad("customJsFunction(" + customValue.ToString() + ")");

For more information please check Send data back to client tutorial.
See also: ExecBeforeLoad and ExecOnLoad tutorials.

Callback data to the server in two ways:

synchronously
- The client waits for the server response before continuing.
- Client script in ExecBeforeLoad method is executed before the server returns the response.
asynchronously
- The client sends the request to server and continues its execution.
- When server returns the response:
  · Client script in ExecBeforeLoad method is executed.
  · Function passed as third parameter is executed.
  · Client script in ExecOnLoad is executed.

For more information please check Sync vs. Async tutorial.

A Callback Panel is a container that can contain contain html, js, css and other server controls - like Calendar, Easy Menu, ASP.NET controls (ASP Textbox, ASP DropDownList, etc.).

It is very useful to load dynamic scripts, dynamic stylesheets, dynamic controls, etc.

<oajax:CallbackPanel runat="server" ID="callbackPanel1">

<content style="background-color:gray">

<asp:Literal id="literalControl" Runat="server"></asp:Literal>

<span>html content</span>

</content>

<loading>

Loading...please wait

<loading>

</oajax:CallbackPanel>

The update of the panel is done making a callback to the server, without reloading the page.

ob_post.UpdatePanel("callbackPanel1");

For more information please check Callback Panel How It Works section.