ICallback & JSON based Javascript Serialization

ICallback & JSON based Javascript Serialization Whilst working in asp.net sometimes we need to call server side methods asynchronously without have postback either it is full page postback or partial page postback so thanks to asp.net team to provide implementation of ICALLBACK very easily. ICALLBACK ICALLBACK is lightweight process, It uses well known xmlhttp object internally to call server side method, it doesn’t cause page postback so doesn’t cause page rendering so we to show output

ICallback & JSON based Javascript Serialization

 

Whilst working in asp.net sometimes we need to call server side methods asynchronously without have postback either it is full page postback or partial page postback so thanks to asp.net team to provide implementation of ICALLBACK very easily.

 

ICALLBACK

ICALLBACK is lightweight process, It uses well known xmlhttp object internally to call server side method, it doesn’t cause page postback so doesn’t cause page rendering so we to show output at client side we need to make output html ourselves and render controls manually.

 

ICALLBACKEVENTHANDLER

ICALLBACK implemented in asp.net by using ICALLBACKEVENTHANDLER interface has two methods, one of them used to be call from javascript (client side code) and other one return result asynchronously back to javascript function.

 

We just need to perform some action through server side code at server side and needs to return results but results could are in instance or object of any class which could be not easy for javascript code to handle easily so here we prefer JSON which stands for Javascript Object Notation.

 

JSON

JSON is lightweight data-interchange format. ASP.NET gives good support for JSON as well, it’s rapidly adopting because of its lightweight and easy to readable by human and machine as well.

 

CALLBACK SERVER SIDE CODE

Let’s first implement ICALLBACKEVENTHANDLER to call server side method asynchronously step by step J

 

Implement Server Side (C#) Page/Control class by System.Web.UI.ICallbackEventHandler

Following are definition of two methods which needs to implement:

 RaiseCallbackEvent method invoke by thru javascript function

public void RaiseCallbackEvent(string eventArgument)

         {

        //to do code here

}

 

GetCallbackResult method invoke itself when processing of RaiseCallbackEvent method completed

 

public string GetCallbackResult()

          {

              return "";

         }

In Page_Load or Page_Init event

Following statements are used to register client side methods.

CallServer(arg, context) as name implies would use to call/raise server side method which was RaiseCallbackEvent string eventArgument)

ReceiveServerData(arg, context) would use to get result through arg parameter by GetCallbackResult()

protected void Page_Load(object sender, EventArgs e)

{

ClientScriptManager scriptMgr = Page.ClientScript;

String cbReference = scriptMgr.GetCallbackEventReference(this, "arg", "ReceiveServerData", "");

String callbackScript = "function CallServer(arg, context) {" + cbReference + "; }";       

cm.RegisterClientScriptBlock(this.GetType(),"CallServer", callbackScript, true);

}

 

          CALLBACK CLIENT SIDE CODE

<script language=javascript type=text/javascript>

function ReceiveServerData(arg, context)

{

    alert(arg);

}

function CallSrv()

{

    CallServer('get customer', '');

}

</script>

 

<input type=”button” value=”get customer” onclick=”CallSrv()” />

 

Thants it. These are the steps which you need to use to call and get result from server side code using ICALLBACK.

 

Now we will go ahead for some very easy steps for JSON based javascript serialization to return results in javascript easily parseable format.

 

Suppose we have following class whose object we need to return to javascript function through javascriptserialization.

 

 

 

SAMPLE CLASS

public class Customer

{

    public string Name;

    public int Age;

}

 

 

JSON CODE

 

declare string jsonResult;

at class level, which would be use to contain final result and return.

 

After some sample code in both methods code will look like the following:

 

public void RaiseCallbackEvent(string eventArgument)

{

        //populate Customer object to return

        Customer customer = new Customer();

        customer.Name = "Muhammad Adnan";

        customer.Age = 24;

 

        //javascript serialization of Customer object

        System.Web.Script.Serialization.JavaScriptSerializer jss;

  jss = new   System.Web.Script.Serialization.JavaScriptSerializer();

 

        //stringbuilder to contain serialized customer object

System.Text.StringBuilder sbCustomer = new System.Text.StringBuilder();

      jss.Serialize(customer, sbCustomer);

 

         

      jsonResult = sbCustomer.ToString();

 }   

 

public string GetCallbackResult()

{

        return jsonResult;

}

 

Asynchronously output would be within a millisecond and without Postback J
 

Conclusion:

Callback is lightweight technique used to call server side methods asynchronously from javascript without any postback and reloading/rendering of unnecessary parts of page and unnecessary code.

JSON is lightweight data interchange format to make server side class’ objects easily parse able by client side code to show output on browser.

 

By Muhammad Adnan Amanullah   Popularity  (1346 Views)
Biography - Muhammad Adnan Amanullah
Computer science graduate .NET Evangelist http://realfantasy.wordpress.com