Adding a Generic Button to the Sample Application

Now that we have discussed overriding methods we are ready to create a generic "New..." button for "quick entry" forms. The way to accomplish this is to create your own button control. This sounds more difficult than it actually is.

A custom control is a class that derives from System.Web.UI.WebControls.WebControl. When you derive the class from WebControl you first have to call the base class's constructor and tell it what type of control you are creating. (Remember, a constructor is a function that executes when we create an instance of a class.) In this case you are going to tell the base class that we are creating a button control (System.Web.UI .HtmlTextWriterTag.Button).

Next we have to override two functions in WebControl. The first function is called AddAttributesToRender. In this function we're going to tell ASP.NET that whenever we generate the HTML for our control we want the tag for our button to have the onClick attribute to invoke the client-side script we wrote in Page_Load. In other words, when the user clicks the button, the code should invoke the client-side script. The second function we have to override is the RenderContents function. In this function we tell ASP.NET how to generate the HTML for our control. We don't have to worry about generating the HTML to make our control a button because we do that in the constructor. But by default our button will be blank, so in the RenderContents function we'll add code to set the text for the button to "New...".

To create a generic button class:

1. Choose Project > Add Class. When asked for the class name , enter NewButton.cs ( Figure 5.30 ).

   Figure 5.30. The NewButton class will wrap a custom button control that we're going to use in the WorkOrder form to display the quick entry form.

   

2. Add the code in Figure 5.31 . This code adds a string property called control. The purpose of this property is to store the id of a listbox to which we're going to add the new "quick entry." In summary, the user will click the New button to bring up the "quick entry" form, then enter a new value in the textbox; click the Save button in the form and the new value will appear inside the listbox next to the button.

   Figure 5.31 The Control property will store the name of the drop-down list control that will be associated with the button.

    public class NewButton {  string _control;   public string Control   {   get   {   return _control;   }   set   {   _control = value;   }   }  

3. After the NewButton class declaration, add the code in Figure 5.32 to make the class inherit from System.Web.UI .WebControls.WebControl.

   Figure 5.32 Web controls are classes that derive from System.Web.UI.WebControls.WebControl.

    public class NewButton  :   System.Web.UI.WebControls.WebControl  { 

4. After the code for the constructor add code to invoke the base class constructor as seen in Figure 5.33 . This tells the base class that we mean to draw a button control.

   Figure 5.33 First we need to tell the base class what type of control we are using. This is necessary because the base class will do the initial rendering of our control into HTML. So this line tells it what type of HTML tag to use for our control, in this case an input tag of type button.

    public NewButton()  : base(   System.Web.UI.HtmlTextWriterTag.Button)  { } 

5. Now add code to override the AddAttributesToRender function as seen in Figure 5.34 . This code tells ASP.NET to add an onClick attribute to our button that invokes the client-side script function we added earlier to Page_Load.

   Figure 5.34 We are overriding the AddAttributes ToRender function to add a call to the fnOpen function when the button is clicked.

    protected override void  AddAttributesToRender  (           System.Web.UI.HtmlTextWriter           writer) {    base.AddAttributesToRender(writer);  writer.AddAttribute("onclick",   "fnOpen(' " + _control + " ');");  } 

6. Override the RenderContents function ( Figure 5.35 ). This code tells ASP.NET to make the contents of the button display the word "New...".

   Figure 5.35 We are overriding the RenderContents function to tell ASP.NET to set the text for our button to New....

    protected override void  RenderContents  (           System.Web.UI.HtmlTextWriter           writer) {  writer.Write("New...");  base.RenderContents(writer); } 

Tips

• In the next section, we will add the code to actually use the button.

• Notice that the code in Figure 5.34 and in Figure 5.35 both make calls to a function in the base class. AddAttributesToRender calls base.AddAttributesToRender before writing the onClick attribute and RenderContents calls base.RenderContents after drawing the text for the button. The only way to know whether you have to call the base class function before or after you do something is by consulting the documentation.