Creating a Web Setup Project for asp.net Application Using Visual Studio

This is a tutorial how you can create a simple web setup project for your asp.net application. We will also add a new wizard step into the msi setup wizard to allow user to choose which environment he is installing and the msi will deploy the appropriate web.config specific for that environment.


1. Create a new Web Application project in Visual Studio


2. Insert the following appSetting into web.config


3. Copy paste the web.config 3 times and rename to the following file name:


Each of the 3 files contain configuration that is specific to their environment(development, SIT and production). You can add more configuration to the config file depend on your application need. We will use these files in the web setup project later.

4. Update each of the new web.config to reflect its environment:


5. Add a new Web Setup Project into the solution.


After you add the Setup project,
Select the Web Application Folder, in the property window, modify the virtual directory name. This is the default virtual directory name which will be installed into IIS. You can change this later during the installation. If you cannot see the Web Application Folder, select the Web Setup project, in visual studio menu, go to View -> Editor -> File System.




6. Right click in the Web Setup project and select Add -> Project output.



7. Make sure the web application in the current solution is selected, then select Primary Output and Content files. This will add the binaries and necessary files into the msi for installation.


8. Right click in the Web Setup project and select Add -> Files. Add the three environment specific web.config file into the setup project.


Now we will begin the steps to add a new dialog to our installer. This dialog will enable user to choose which environment he want to install and the installer will deploy the appropriate web.config file to the installed folder.

9. Make sure the Web Setup Project is selected. In the visual studio menu, go to View -> Editor -> User Interface. You will now see the list of dialogs which will be presented during the installation time.


10. Right click on the Start node and select Add Dialog.


11. Select the Radio Buttons (3 buttons) dialog


12. Right click on the new dialog you just added and select Move Up. This is to re-order the sequence of dialog presentation during installation time.


The dialog sequence should look like this after you complete the step.


13. Select the Radio Button dialog, and in the property window, modify the property value to match the following:



The value of the ButtonProperty is the name which will be used for lookup later. The value you specified for ButtonProperty is case sensitive. The ButtonValue is the value which will be set into the lookup name specified by te ButtonProperty. For example, if you select SIT, "2" will be assigned to ENVIRONMENT.

14. Now select the web.config_dev in the Web Setup project. In the property window, set the Condition and target name to match the following:



Repeat the same for web.config_sit (set the condition to ENVIRONMENT="2") and web.config_prod (set the condition to ENVIRONMENT="3")
If you specify a condition, the file will only be install if the condition is evaluated to true. The value for ENVIRONMENT is assigned in the Radion Button dialog depend on which radio button you select. Remember "ENVIRONMENT" is case sensitve. It has to match the ButtonProperty value which you specified in the Radio Button dialog.
The TargetName is the actual name for the file when it is copied into the installed folder. In this case, we want to rename it to web.config


15. Next, we want to exclude the original web.config file from the web application project. The final web.config will be copied from either one of three environment specific web.confg file. In the Web Setup project, right click on the Content Files, select Exclude Filter.



Add web.config to the filter dialog and click OK.


You can now build the installer and run the MSI to install your web application. Remember to run the MSI as administrator if you are in Vista and above.

You will see the installer wizard dialog as following:
This is the standard dialog for web appliction.


This is the dialog which we add to allow user to choose the installation environment.


After the installation complete, you can open the web.config to verify the correct file for that environment has been installed.

ASPNET: Maintain Page position on Postback

When you have a long web page, you might want to maintain the page position after the post back so that tbe user does not have to scroll down to the page again. This is a very important usability issue.

In ASP.NET 1.1, you can achieve this using the SmartNavigation page directive:

<%@ Page Language="C#" SmartNavigation="true"%>

However, SmartNavigation require IE 5.5 or above.

ASP.NET 2.0 introduce a new page directive call MaintainScrollPositionOnPostback which achive the same result.

<%@ Page Language="C#" MaintainScrollPositionOnPostback="true" %>

I tested MaintainScrollPositionOnPostback in both IE and Firefox and it work prefectly in both browser. Better still, you can enable this for all web pages in your web site by setting it in the web.config under <pages> element.

ASPNET 2.0 : Finding control in WebForm that use MasterPage

When you try to lookup a control by passing a control ID to the FindControl method,
it work a little bit differenly depend on whether your WebForm page use MasterPage or not.

If your are not using MasterPage, the following code will simple return a reference to the WebControl with ID "TextBox1".

        Control c = FindControl("TextBox1");

However, if your WebForm use MasterPage, the above code won't work. You have to get a reference to the ContentPlaceHolder which contain your control and then call FindControl() on the ContentPlaceHolder object.

The following code show hot to do it. Create the following MasterPage and call it MasterPage.master

<%@ Master Language="C#"
   AutoEventWireup="true"
   CodeFile="MasterPage.master.cs"
   Inherits="MasterPage" %>

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:contentplaceholder id="ContentPlaceHolder1"
        runat="server">
        </asp:contentplaceholder>
    </div>
    </form>
</body>
</html>

Now, create a WebForm that use MasterPage.master as master page and insert a TextBox into the WebForm. Give the TextBox an ID "txtFindControl".

<%@ Page Language="C#"
    AutoEventWireup="true"
    CodeFile="MasterPageJustFindControl.aspx.cs"
    Inherits="MasterPageJustFindControl"
    MasterPageFile="~/MasterPage.master" %>

<asp:Content ID="Content1"
             ContentPlaceHolderID="ContentPlaceHolder1"
             Runat="Server">
     <asp:TextBox ID="txtFindControl" runat="server">
     </asp:TextBox>   
</asp:Content>

Next, go to the code behind file of the web form and insert the following code:

public partial class MasterPageJustFindControl : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        JustFindControl();
        MasterPageFindControl();
    }

    private void JustFindControl()
    {
        Control c = FindControl("txtFindControl");

        if (c is WebControl)
        {
            Response.Write("<BR>JustFindControl : WebControl found<BR>");
        }
        else
        {
            Response.Write("<BR>JustFindControl : NOT found<BR>");
        }

    }

    private void MasterPageFindControl()
    {
        ContentPlaceHolder cpholder = (ContentPlaceHolder)Master.
             FindControl("ContentPlaceHolder1");

        Control c = cpholder.FindControl("txtFindControl");

        if (c is WebControl)
        {
            Response.Write("<BR>MasterPageFindControl : WebControl found<BR>");
        }
        else
        {
            Response.Write("<BR>MasterPageFindControl : NOT found<BR>");
        }

    }

}

When you run the above code, the output should be

JustFindControl : NOT found

MasterPageFindControl : WebControl found

That approach make some sense though. Because a MasterPage can have multiple ContentPlaceHolder(s) which host different WebForm. Each of those WebForm could have controls with the same ID. So, I think this is a way to isolate the controls from being having ID conflict.

ASP.NET Compiler Error 128

If you ever hit the above error in your ASP.NET application, Scott Hanselman has some words on this.

http://www.hanselman.com/blog/PermaLink.aspx?guid=bf4814b2-c3b8-4fa6-b232-9fad081eaab4