ASP.NET and XML/XSLT

kwilliams · January 8th, 2007, 01:03 PM

I'm creating a site that's going to use the ASP.NET Master Page Control to transform XML/XSLT data into the content section of an ASP.NET form. I've already created the basic setup for the site (code below), and some of the content, but I have a few questions/concerns about this method:

What I don't like about the Master Page Control so far is the size of the pages. I haven't even put any content on the main section of the page, and it's already 31043 bytes in size. What are some steps that I can take to optimize this site (i.e. caching)? Also, how should I go about creating and processing a form within a transformed page using the Master Page control? Should I use XForms (like http://www.w3schools.com/xforms/default.asp) or dynamic ASP.NET server controls within XML (like http://www.dnzone.com/ShowDetail.asp?NewsId=151)?

MASTER PAGE - NavMaster.master

Code:

<%@ Master Language="VB" CodeFile="NavMaster.master.vb" Inherits="NavMaster" Debug="True" %>

<!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>Nav MasterPage</title>
    <link rel="stylesheet" type="text/css" media="screen" href="~/docs/css/screen.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="wrapper">

        <div id="tabs">
            <asp:Menu id="Menu2" runat="server" 
                StaticDisplayLevels="1" 
                StaticSubMenuIndent="1"
                StaticMenuStyle-VerticalPadding="0"
                Orientation="Horizontal"
                StaticEnableDefaultPopOutImage="False"
                StaticMenuItemStyle-HorizontalPadding="0" StaticMenuStyle-HorizontalPadding="0">
                <Items>
                    <asp:MenuItem NavigateUrl="default.aspx" ImageUrl="~/images/gif/tab1_active.gif" />
                    <asp:MenuItem NavigateUrl="~/aboutus/aboutus.aspx" ImageUrl="~/images/gif/tab2_active.gif" />
                    <asp:MenuItem NavigateUrl="~/depts/depts.aspx" ImageUrl="~/images/gif/tab3_active.gif" />
                </Items>
            </asp:Menu>
        </div>

        <div id="screenleft">
            <asp:contentplaceholder 
                id="LeftColumn" 
                runat="server" />
        </div>

        <div id="content">

            <h1><asp:label id="lblPageTitle" runat="server" /></h1>
            <br />


            <asp:SiteMapPath 
                id="SiteMapPath1" 
                Runat="Server" />
            <br /><br />

            <asp:contentplaceholder 
                id="ContentColumn" 
                runat="server" />
        </div>

        <div id="screenright">
            <asp:ContentPlaceHolder 
                id="RightColumn" 
                runat="server">
                <asp:Image
                    ID="Ad1" 
                    ImageUrl="~/images/gif/ad1.gif"
                    Runat="Server" />
                <br />
                <asp:Image
                    ID="Ad2"  
                    ImageUrl="~/images/gif/ad2.gif"
                    Runat="Server" />
            </asp:ContentPlaceHolder>
        </div>

        <div id="screenfooter">
            This is the footer section
        </div>
    </div>
    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
    </form>
</body>
</html>

SITEMAP - web.sitemap

Code:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
  <siteMapNode url="~/default.aspx" title="Home" description="Home">
    <siteMapNode id="aboutus" url="~/aboutus/aboutus.aspx" title="About Us" description="About Us">
    </siteMapNode>
    <siteMapNode url="~/depts/depts.aspx" title="Departments" description="Departments">
    </siteMapNode>
  </siteMapNode>
</siteMap>

ASP.NET PAGE - default.aspx

Code:

<%@ Page Language="VB" MasterPageFile="~/NavMaster.master" AutoEventWireup="false" CodeFile="default.aspx.vb" Inherits="_default" title="Home Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="LeftColumn" Runat="Server">

<div id="screenleftnav">
    <div class="leftheader">About Us</div>
    [list]
        <li><a href="">Button 1</a></li>
        <li><a href="">Button 2</a></li>
        <li><a href="">Button 3</a></li>
        <li><a href="">more...</a></li>
    </ul>
    <div class="leftheader">Departments</div>
    [list]
        <li><a href="">Button 4</a></li>
        <li><a href="">Button 5</a></li>
        <li><a href="">Button 6</a></li>
        <li><a href="">more...</a></li>
    </ul>
    <br />
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentColumn" Runat="Server">
    This is the main content section. This is where the XML/XSLT transformation will take place.
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="RightColumn" Runat="Server">
<div id="screenright">
    This is the right content section.
</div>
</asp:Content>

VB.NET PAGE - default.aspx.vb

Code:

Partial Class NavMaster
    Inherits System.Web.UI.MasterPage
    Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        lblPageTitle.Text = SiteMap.CurrentNode.Description
    End Sub
End Class

RESULTING CODE

Code:

<!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>
    <title>Douglas County, Kansas - Home</title>
    <link rel="stylesheet" type="text/css" media="screen" href="docs/css/screen.css" />
    <style type="text/css">
        .ctl00_Menu1_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; }
        .ctl00_Menu1_1 { text-decoration:none; }
        .ctl00_Menu1_2 {  }
        .ctl00_Menu2_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; }
        .ctl00_Menu2_1 { text-decoration:none; }
        .ctl00_Menu2_2 {  }
        .ctl00_Menu2_3 {  }
        .ctl00_Menu2_4 { padding:0px 0px 0px 0px; }
        .ctl00_Menu2_5 { padding:0px 0px 0px 0px; }
    </style>
</head>
<body>
    <form name="aspnetForm" method="post" action="default.aspx" id="aspnetForm">
    <div>
        <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
        <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
        <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMTgxMjAzNjcwD2QWAmYPZBYCAgMPZBYEAg0PPCsADQIADxYCHgtfIURhdGFCb3VuZGdkDBQrAAIFAzA6MBQrAAIWEh4FVmFsdWUFBEhvbWUeCURhdGFCb3VuZGceCFNlbGVjdGVkZx4EVGV4dAUESG9tZR4LTmF2aWdhdGVVcmwFHC9NYXN0ZXJQYWdlU2l0ZS9kZWZhdWx0LmFzcHgeB0VuYWJsZWRnHgpTZWxlY3RhYmxlZx4HVG9vbFRpcAUESG9tZR4IRGF0YVBhdGgFHC9tYXN0ZXJwYWdlc2l0ZS9kZWZhdWx0LmFzcHgUKwAHBRcwOjAsMDoxLDA6MiwwOjMsMDo0LDA6NRQrAAIWEB8EBRBBYm91dCB0aGUgQ291bnR5HwEFEEFib3V0IHRoZSBDb3VudHkfBQUkL01hc3RlclBhZ2VTaXRlL2Fib3V0ZGMvYWJvdXRkYy5hc3B4HwgFEEFib3V0IHRoZSBDb3VudHkfBmcfB2cfCQUkL21hc3RlcnBhZ2VzaXRlL2Fib3V0ZGMvYWJvdXRkYy5hc3B4HwJnFCsAAgUDMDowFCsAAhYQHwQFCFByb2R1Y3RzHwEFCFByb2R1Y3RzHwUFJS9NYXN0ZXJQYWdlU2l0ZS9hYm91dGRjL3Byb2R1Y3RzLmFzcHgfCAUIUHJvZHVjdHMfBmcfB2cfCQUlL21hc3RlcnBhZ2VzaXRlL2Fib3V0ZGMvcHJvZHVjdHMuYXNweB8CZ2QUKwACFhAfBAULRGVwYXJ0bWVudHMfAQULRGVwYXJ0bWVudHMfBQUgL01hc3RlclBhZ2VTaXRlL2RlcHRzL2RlcHRzLmFzcHgfCAULRGVwYXJ0bWVudHMfBmcfB2cfCQUgL21hc3RlcnBhZ2VzaXRlL2RlcHRzL2RlcHRzLmFzcHgfAmcUKwACBQMwOjAUKwACFhAfBAUIU2VydmljZXMfAQUIU2VydmljZXMfBQUjL01hc3RlclBhZ2VTaXRlL2RlcHRzL3NlcnZpY2VzLmFzcHgfCAUIU2VydmljZXMfBmcfB2cfCQUjL21hc3RlcnBhZ2VzaXRlL2RlcHRzL3NlcnZpY2VzLmFzcHgfAmdkFCsAAhYQHwQFDkRpc3RyaWN0IENvdXJ0HwEFDkRpc3RyaWN0IENvdXJ0HwUFJS9NYXN0ZXJQYWdlU2l0ZS9kZXB0cy9kYy9kY19ob21lLmFzcHgfCAUORGlzdHJpY3QgQ291cnQfBmcfB2cfCQUlL21hc3RlcnBhZ2VzaXRlL2RlcHRzL2RjL2RjX2hvbWUuYXNweB8CZ2QUKwACFhAfBAUKRW1wbG95bWVudB8BBQpFbXBsb3ltZW50HwUFKy9NYXN0ZXJQYWdlU2l0ZS9kZXB0cy9hcy9wZS9lbXBsb3ltZW50LmFzcHgfCAUKRW1wbG95bWVudB8GZx8HZx8JBSsvbWFzdGVycGFnZXNpdGUvZGVwdHMvYXMvcGUvZW1wbG95bWVudC5hc3B4HwJnZBQrAAIWEB8EBRBMb2NhbCBHb3Zlcm5tZW50HwEFEExvY2FsIEdvdmVybm1lbnQfBQUqL01hc3RlclBhZ2VTaXRlL2xvY2FsX2dvdnQvbG9jYWxfZ292dC5hc3B4HwgFEExvY2FsIEdvdmVybm1lbnQfBmcfB2cfCQUqL21hc3RlcnBhZ2VzaXRlL2xvY2FsX2dvdnQvbG9jYWxfZ292dC5hc3B4HwJnZBQrAAIWEB8EBQ9PbmxpbmUgU2VydmljZXMfAQUPT25saW5lIFNlcnZpY2VzHwUFNC9NYXN0ZXJQYWdlU2l0ZS9vbmxpbmVfc2VydmljZXMvb25saW5lX3NlcnZpY2VzLmFzcHgfCAUPT25saW5lIFNlcnZpY2VzHwZnHwdnHwkFNC9tYXN0ZXJwYWdlc2l0ZS9vbmxpbmVfc2VydmljZXMvb25saW5lX3NlcnZpY2VzLmFzcHgfAmcUKwACBQMwOjAUKwACFhAfBAUHZUFsZXJ0cx8BBQdlQWxlcnRzHwUFLC9NYXN0ZXJQYWdlU2l0ZS9vbmxpbmVfc2VydmljZXMvZWFsZXJ0cy5hc3B4HwgFB2VBbGVydHMfBmcfB2cfCQUsL21hc3RlcnBhZ2VzaXRlL29ubGluZV9zZXJ2aWNlcy9lYWxlcnRzLmFzcHgfAmdkZAITDw8WAh8EBQRIb21lZGQYAQULY3RsMDAkTWVudTEPD2QFBEhvbWVkXp6pLJa+v0aDYZ0Mw0FTTM5KeMs=" />
    </div>

    <script type="text/javascript">
        <!--
        var theForm = document.forms['aspnetForm'];
        if (!theForm) {
            theForm = document.aspnetForm;
        }
        function __doPostBack(eventTarget, eventArgument) {
            if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
                theForm.__EVENTTARGET.value = eventTarget;
                theForm.__EVENTARGUMENT.value = eventArgument;
                theForm.submit();
            }
        }
        // -->
    </script>


    <script src="/MasterPageSite/WebResource.axd?d=KKLQ16-PAjSAdMyUqtO2OA2&amp;t=632996128439938112" type="text/javascript"></script>


    <script src="/MasterPageSite/WebResource.axd?d=9YVgtnxkl_EC7ZeDVABhuQ2&amp;t=632996128439938112" type="text/javascript"></script>
    <div id="wrapper">

                <div id="tabs">
            <a href="#ctl00_Menu2_SkipLink"><img alt="Skip Navigation Links" src="/MasterPageSite/WebResource.axd?d=C877-NPBnLlA_xyeDHjJzA2&amp;t=632996128439938112" width="0" height="0" style="border-width:0px;" /></a>
            <table id="ctl00_Menu2" class="ctl00_Menu2_5 ctl00_Menu2_2" cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_Menu2n0">
                    <table class="ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%">
                        <tr>
                            <td style="white-space:nowrap;"><a class="ctl00_Menu2_1 ctl00_Menu2_3" href="default.aspx"><img src="images/gif/tab1_active.gif" alt="" style="border-style:none;vertical-align:middle;" /></a></td>
                        </tr>
                    </table>
                    </td>
                    <td style="width:3px;"></td>
                    <td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_Menu2n1">
                    <table class="ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%">
                        <tr>
                            <td style="white-space:nowrap;"><a class="ctl00_Menu2_1 ctl00_Menu2_3" href="aboutus/aboutus.aspx"><img src="images/gif/tab2_active.gif" alt="" style="border-style:none;vertical-align:middle;" /></a></td>
                        </tr>
                    </table>
                    </td>
                <td style="width:3px;"></td>
                <td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" id="ctl00_Menu2n2">
                <table class="ctl00_Menu2_4" cellpadding="0" cellspacing="0" border="0" width="100%">
                    <tr>
                        <td style="white-space:nowrap;"><a class="ctl00_Menu2_1 ctl00_Menu2_3" href="depts/depts.aspx"><img src="images/gif/tab3_active.gif" alt="" style="border-style:none;vertical-align:middle;" /></a></td>
                    </tr>
                </table>
                </td>
                </tr>
            </table>
            <a id="ctl00_Menu2_SkipLink"></a>
        </div>

        <div id="screenleft">


            <div id="screenleftnav">
                   <div class="leftheader">About Us</div>
                    [list]
                        <li><a href="">Button 1</a></li>
                        <li><a href="">Button 2</a></li>
                        <li><a href="">Button 3</a></li>
                        <li><a href="">more...</a></li>
                    </ul>
                <div class="leftheader">Departments</div>
                    [list]
                           <li><a href="">Button 4</a></li>
                        <li><a href="">Button 5</a></li>
                        <li><a href="">Button 6</a></li>
                        <li><a href="">more...</a></li>
                    </ul>
                    <br />
            </div>

        </div>

        <div id="content">

            <h1><span id="ctl00_lblPageTitle">Home</span></h1>
                    <br />


                    <span id="ctl00_SiteMapPath1"><a href="#ctl00_SiteMapPath1_SkipLink"><img alt="Skip Navigation Links" height="0" width="0" src="/MasterPageSite/WebResource.axd?d=C877-NPBnLlA_xyeDHjJzA2&amp;t=632996128439938112" style="border-width:0px;" /></a><span>Home</span><a id="ctl00_SiteMapPath1_SkipLink"></a></span>
                    <br /><br />

                This is the main content section
        </div>

        <div id="screenright">

    <div id="screenright">
        This is the right content section
    </div>

    <div id="screenfooter">
        This is the footer section
    </div>
    </div>


<div>

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWDQLLxL+WBgLIi9OIAQLf6Ie+DQLdgvPlDQKO1LKcCwLb4MClDQLggdHzAwLb4MClDQLggdHzAwLb4MClDQLggdHzAwLb4MClDQLggdHzAxNB1ZKW3G9fVbk/8m+rafTOxMR4" />
</div>

<script type="text/javascript">
    <!--
    var ctl00_Menu1_Data = new Object();
    ctl00_Menu1_Data.disappearAfter = 5;
    ctl00_Menu1_Data.horizontalOffset = 0;
    ctl00_Menu1_Data.verticalOffset = 0;
    var ctl00_Menu2_Data = new Object();
    ctl00_Menu2_Data.disappearAfter = 500;
    ctl00_Menu2_Data.horizontalOffset = 0;
    ctl00_Menu2_Data.verticalOffset = 0;
    // -->
</script>
</form>
</body>
</html>

KWilliams