|
Developer's Guide to ASP.NET 3.5 |
|
Master ASP.NET 3.5 development using C# and Visual Studio.NET 2008. Web forms, server controls, data binding, AJAX, ASMX and WCF services and more... |
|
|
Kriya Yoga for Software Developers |
|
Importance of concentration, confidence, positive attitude, better personality and stress free life need not be emphasized separately in today's competitive world... |
|
Handling Post Back Events
Introduction
Post back data is not the only thing that you may want to deal with in your
custom controls. You may want your control to cause a post back and raise some
server side event such as Click or SelectedIndexChanged. Handling a post back
event requires that your control implements IPostBackEventHandler interface. In
this article I explain how that can be done.
IPostBackEventHandler Interface
The IPostBackEventHandler interface must be implemented by your custom
control class if it requires to handle post back event. This interface contains
a single method as shown below:
void RaisePostBackEvent(string eventArgument)
The PaisePostBackEvent() method gives you a chance to raise a server side
post back event (e.g. Click or SelectedIndexChanged). The method receives an
event argument parameter of type string which may contain event argument
data if any.
Example
Let's create a simple custom control that implements IPostBackEventHandler
interface and raises Click event upon post back. Begin by creating a new web
site in Visual Studio.
Add App_Code to your web site and further add a new class named GraphicButton.
The following code shows the class definition.
namespace BinaryIntellect.UI
{
public class GraphicButton : WebControl, IPostBackEventHandler
{
public GraphicButton(): base(HtmlTextWriterTag.Span)
{
}
...
Here, you create a class named GraphicButton that resides in
BinaryIntellect.UI namespace. The GraphicButton class inherits from WebControl
base class and implements IPostBackEventHandler interface. The constructor of
GraphicButton class calls its base class constructor by passing
HtmlTextWriterTag. This indicates that your control builds over <SPAN> tag.
Now add two public properties viz. ImageUrl and Text to the GraphicButton
class.
public string ImageUrl
{
get { return ViewState["imgurl"] as string; }
set { ViewState["imgurl"] = value; }
}
public string Text
{
get { return ViewState["text"] as string; }
set { ViewState["text"] = value; }
}
The ImageUrl property specifies the image URL to be displayed and Text
property specifies the text to be rendered. Both of the property values are
stored in ViewState. Then declare Click event as shown below:
public event EventHandler Click;
The Click event is raised when user clicks on the image rendered by the
GraphicButton control. Now override the RenderContents() method of the
WebControl base class and emit the required markup.
protected override void RenderContents(HtmlTextWriter writer)
{
base.RenderContents(writer);
writer.WriteFullBeginTag("center");
writer.WriteBeginTag("img");
writer.WriteAttribute("name", this.UniqueID);
writer.WriteAttribute("src", ImageUrl);
writer.WriteAttribute("onclick",
Page.ClientScript.GetPostBackEventReference
(this, string.Empty));
writer.Write("/>");
writer.Write("<br />");
writer.Write(Text);
writer.WriteEndTag("center");
}
Here, we render an image tag and set its name and src attributes. It also
renders the Text property value below the image. In order that the image tag
triggers a post back event you need to handle its client side onclick event
handler. Notice the call to GetPostBackEventReference() method. This method
returns a javascript function (__doPostBack()) that actually causes the post
back. The GetPostBackEventReference() method accepts two parameters viz. the
control that will receive the post back and event arguments if any. If you
supply some event arguments then they will be passed on to RaisePostBackEvent()
method.
Finally, implement the IPostBackEventHandler interface by writing
RaisePostBackEvent() method.
public void RaisePostBackEvent(string eventArgument)
{
Click(this, EventArgs.Empty);
}
Here, you simply raise the Click event of GraphicButton control.
This completes the control. In order to use it on a web form register it with
the page framework as shown below:
<%@ Register
Namespace="BinaryIntellect.UI"
TagPrefix="mycontrols" %>
Also create an instance of the GraphicButton control on the web form.
<mycontrols:GraphicButton runat="server" ID="button1"
Text="Save changes to database"
ImageUrl="SaveButton.gif"
onclick="button1_Click"
Font-Bold="True" />
Set the ImageUrl and Text properties to some image URL and text respectively
and run the web form. Handle the Click event of the GraphicButton as follows:
protected void button1_Click
(object sender, EventArgs e)
{
Label1.Text = "Button clicked";
}
The following figure shows a sample run of the web form.
