ICallback Event Handler

Share |

This article will explain the use of “ICALLBACKEventHandler” in asp.net 2.0.
About ICallbackEventHandler:
ASP.NET 2.0 introduces an interface ICallbackEventHandler (System.Web.UI.ICallbackEventHandler) to allow asynchronous communication with the server. Unlike Postback, in Callback only user defined information is sent back to the server.
ICallbackEventHandler uses DoCallback event to send user defined data to server (instead of postback event), and return the String to client; on client side JavaScript manipulates the string. This interface implements two functions on server side (i.e. c# or vb) and we need to implement two functions on client side i.e. in JavaScript.(You can DOWNLOAD demo Code for Reference)

Use of ICallbackEventHandler:
To use ICallbackEventHandler, we need to impliment it on the page or on the User control. The code will be look like
<br /> public partial class Default2 : System.Web.UI.Page,System.Web.UI.ICallbackEventHandler<br />

Once we impliment this interface; we will have to play with 4 functions, two client side functions i.e. java script function, and two server side function i.e. c# (in this case).
As from ICallbackEventHandler, we have to use two functions namely (These functions or methods belongs to ICallbackEventHandler interface. C#)
1.public void RaiseCallbackEvent(String eventArgument)
2.public String GetCallbackResult()
RaiseCallbackEvent function gets call automatically whenever there is a CallbackEvent. And after this function 2nd function i.e. GetCallbackResult get called automatically.
2nd function returns a string to client.
How to raise a CallbackEvent?
To raise a callback event from client side we will use javascript function.
There will be two javascript functions whos functionality is as follows
1.Function which will call RaiseCallbackEvent, i.e. raise a callback event.
2.Function which will handle the response from the server. This function will be called automatically after GetCallbackResult(). I.e. the string returned by GetCallbackResult will appear in JavaScript as input to this function.

We will go on developing the code for better understanding of ICallbackEventHandler.
1.Create ASPX page design as follows
<br /> <br /> <form id="form1" runat="server"><br /> <div><br /> Select The Item and Click the Button<br /> <asp:dropdownlist id="DropDownList1" runat="server"></asp:DropDownList><br /> <br /> <br /> <br /> <br /> <button type="Button" onclick="CheckForTimeZone()">Get Timezone</button><br /> <br /> <br /> <table><tr> <td>GMT Time zone is :</td> <td><div id="Results" runat="server"></div></td> </tr> </table><br /> <br /> <br /> </div><br /> </form><br /> <br />
In above design “CheckForTimeZone()” in the button tag, is a javascript function, we will add it latter, under javascript tag.
Here button is a HTML control.
2.After this; we will write following JavaScript to the Aspx page.
<br /> <script type="text/ecmascript"> function CheckForTimeZone() { var lb = document.getElementById("DropDownList1"); var selectedItem = lb.options[lb.selectedIndex].text; CallServer(selectedItem, ""); } function ReceiveServerData(retValue) { document.getElementById("Results").innerHTML = retValue; } </script><br /> <br />
You can just copy paste the code.
In above code “CallServer(selectedItem, "")” will be responsible for calling “RaiseCallbackEvent” on server side.
And “ReceiveServerData(retValue)” function gets called by
public String GetCallbackResult().
To make above code work the way we want; we will write code in aspx.cs file.
3.We will add C# code i.e. ASPX.Cs file
<br /> public partial class Default2 : System.Web.UI.Page,System.Web.UI.ICallbackEventHandler<br /> {<br /> private static Hashtable hashTable;<br /> protected String returnValue;<br /> protected void Page_Load(object sender, EventArgs e)<br /> {<br /> if (!IsPostBack)<br /> {<br /> String cbReference =<br /> Page.ClientScript.GetCallbackEventReference(this, "arg", "ReceiveServerData", "context");<br /> String callbackScript;<br /> callbackScript = "function CallServer(arg, context)" +<br /> "{ " + cbReference + ";}";<br /> Page.ClientScript.RegisterClientScriptBlock(this.GetType(),<br /> "CallServer", callbackScript, true);<br /> <br /> hashTable = new Hashtable();<br /> hashTable.Add("Hawaii", "GMT -10:00");<br /> hashTable.Add("Central America", "GMT -06:00");<br /> hashTable.Add("Greenland", "GMT -03:00");<br /> hashTable.Add("Athens", "GMT +02:00");<br /> <br /> DropDownList1.DataSource = hashTable;<br /> DropDownList1.DataTextField = "key"; //If you say value Values from HashTable will be added to Drpdownlist<br /> DropDownList1.DataBind();<br /> }<br /> }<br /> <br />
Please go through the above code line by line and then continue with following explanations.
String cbReference = Page.ClientScript.GetCallbackEventReference(this, "arg", "ReceiveServerData", "context");
If we debug the code “cbReference” will contain “WebForm_DoCallback('__Page',arg,ReceiveServerData,context,null,false)”;
Observe the string, WebForm_DoCallback contains ReceiveServerData, it’s a java script function we have written in step 2.
<br /> String callbackScript;<br /> callbackScript = "function CallServer(arg, context)" + "{ " + cbReference + ";}";<br />
Again “callbackScript” will contain some string. Actually it is a JavaScript function which we will register to the client page. Using
<br /> Page.ClientScript.RegisterClientScriptBlock(this.GetType(),<br /> "CallServer", callbackScript, true);<br />
Using above line of code we have registered our CallServer function to the page.
In above point we are registering the CallServer function. Now again see the 2nd point we are passing selected item of the Dropdown list to this function.
i.e. CallServer(selectedItem, "");
if you see the source code of the page then CallServer function will appear as follows
<br /> <script type="text/javascript"> <!-- function CallServer(arg, context){ WebForm_DoCallback('__Page',arg,ReceiveServerData,context,null,false);}// --> </script><br />
This CallServer function is responsible to raise the callbackEvent i.e. RaiseCallbackEvent(String eventArgument), and the “arg” will be appeared as eventArgument.
4.We will add RaisecallbackEvent and GetCallbackResult.
Add following code to aspx.cs file
<br /> public void RaiseCallbackEvent(String eventArgument)<br /> {<br /> if (hashTable[eventArgument] == null)<br /> {<br /> returnValue = "-1";<br /> }<br /> else<br /> {<br /> returnValue = hashTable[eventArgument].ToString();<br /> }<br /> }<br /> public String GetCallbackResult()<br /> {<br /> return returnValue;<br /> }<br /> <br />

Download Demo Code here --> ICallbackEventHandler.zip