We want no postbacks

Well last week I had to quickly redevelop the web forms I developed to implement no postbacks. The forms we are developing has several fields and to do a post back on each one would slow the webpages down. So the solution was simple enough of switching out asp image button with a old style html input button. Now we can open a new window without postback and send back information into a textbox field with out any slow downs.

P.S. I have a complaint about about browsers and W3C, to center a page you have to use the attribute "style" with the left and right width to auto. The thing is that this doesn't work in the browsers (IE and Firefox). So while in VS 2005 I made a div tag with the attribute 'align' sent to center, but this of course gives a warning that this technique is out dated. WTF?!?!?!?!?!?!?!?!?!

Web Controls and Pop Up Windows with ASP.Net 2.0

One of the first web controls that we developed with good reusability is a web control that pops up another window. This doesn't seem much, but does give more posibilites of what can then be done on the newly open window.

Well, to have a pop up window, we developed a image button, which can be used and is more user friendly. We also wanted to make it more possible to change the size of the pop up window.

private System.Web.UI.WebControls.ImageButton _imageBtn; //Button with image used to call pop-up page
private System.String _popUpLoc; //Location of the popup page
private System.Web.UI.WebControls.Unit _popUpPageWidth; //Width of the pop up page
private System.Web.UI.WebControls.Unit _popUpPageHeight; //Height of the pop up page

Next are the properties so we can change values during the design view. Most of which are obvious, so here is an example of one:

[Bindable(true)]//used for binding
[Category("Pop Up Window")] //in properties section "Pop Up Window"
[Description("The URL of the pop-up webpage")]//description of PagePopUp
[DefaultValue("")]//default value
[Localizable(true)]//allow multi-language
public virtual System.String PopUpURL
{
get
{
return this._popUpLoc; //returns a string representing the location of the image
}
set
{
this._popUpLoc = value; //set the string value for the location of the image button
}
}

etc... for the other properties you might want to set. Use EnsureChildControls(); for controls that are used on the page.

Next override the CreateChildControls:

protected override void CreateChildControls()
{
Controls.Clear(); //clear the controls before adding them

this._imageBtn = new System.Web.UI.WebControls.ImageButton();//declare image button with image on it
this._imageBtn.ID = "CalendarBtn";//set the id of the image button


Controls.Add(this._imageBtn);//add the image button to the child control collection
}

In the render control is where we add an attribute to the image button.

protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
AddAttributesToRender(writer); //add HTML that needs to be render
/*
* Calls javascript to open a new window and send in the text box id
*
* this.PopUpURL is the page to pop open
* this.Page.Form.ClientID represents the page's form id eg:

* this.ClientID represents the web controls's ID eg:
* the height and width variables are used to set the dimensions of the browser
* the status= no, resizable= no, scrollbars=no, toolbar=no,location=no,menubar=no are used to remove usless items and fixate the window size
*
* Note: since during the page initialization the controls are developed before the page
* we had to place the _imageBtn.Attributes.Add(...) into the render method
* to prevent NullException error.
*
*/
_imageBtn.Attributes.Add("onclick", "window.open('" + this._popUpLoc
+ "?field=" + this.Page.Form.ClientID + "." + this.ClientID
+ "',null,'height=" + this._popUpPageHeight + ", width="
+ this._popUpPageWidth + ",status= no, resizable= no, scrollbars=no, toolbar=no, location=no, menubar=no ');");
this._imageBtn.RenderControl(writer);//render the image button
}

How To: Run Web Control next to an application during development

So here at work, we are trying to get some web controls to work with pop-up windows. Here is a nice easy way to set up your test envirnoment.

Create a new website for testing. Eg. WebControlTester.

within the Solution Explorer place your web control into a new folder App_Code

then add a web.config file to the Solution Explorer.

Within the web.config file add:

<pages>
  <controls>
    <add namespace="Your.Namespace.In.WebControl" tagprefix="SomeTagPrefix">
  </controls>
</pages>

Now you can edit your web control, build it and then switch to the web site and run it.

<^_^>