You are currently offline, waiting for your internet to reconnect

HOW TO: Display an XML Document in ASP.NET by Using the Xml Web Server Control

This article was previously published under Q315906
Retired KB Content Disclaimer
This article was written about products for which Microsoft no longer offers support. Therefore, this article is offered "as is" and will no longer be updated.
This step-by-step article demonstrates how to use the Xml Web server control so that you can display an Extensible Markup Language (XML) document by using Extensible Stylesheet Language Transformation (XSLT) from within the Microsoft .NET Framework.

The Xml control makes it easy to use XML data in a Web Form. The Xml control encapsulates the code that the page author traditionally adds.

back to the top


The following list outlines the recommended hardware, software, network infrastructure, and service packs that are required:
  • Microsoft Windows 2000 Professional, Microsoft Windows 2000 Server, or Microsoft Windows XP Professional with the Microsoft .NET Framework installed
This article assumes that you are familiar with the following topics:
  • XML and Extensible Stylesheet Language Transformation (XSLT)
  • .NET Framework Web server controls
back to the top

Display an XML Document from .NET

In this section, you create a small ASP.NET Web application that allows a customer to select lunch menu items based on calorie count. To do this, the sample uses the Xml Web server control, a simple XML document that contains the menu data, and an XSL stylesheet to transform the XML data. You can use the XsltArgumentList class from the System.Xml.Xsl namespace to access parameters in the transformation.
  1. Create a Visual Basic Web application as follows:
    1. Start Microsoft Visual Studio .NET, point to New, and then click Project.
    2. Under Project Types, click Visual Basic Projects. Under Templates, click ASP.NET Web Application.
    3. In the Name box, type Menu, and then click OK.
  2. Make sure that the Solution Explorer window is visible. If this window is not visible, press CTRL+ALT+L.
  3. WebForm1.aspx should be open in Design View. If not, double-click WebForm1.aspx in Solution Explorer.
  4. Press the F4 key to access the property page. Change the pageLayout property to FlowLayout.
  5. On the Web Form, type Maximum Calories: .
  6. Add a TextBox control, a Button control, and an Xml control to the form as follows:
    1. Press CTRL+ALT+X to open the toolbox.
    2. In the toolbox, click Web Forms.
    3. Drag a TextBox control and a Button control from the toolbox to the Web Form.
    4. Press F4 to access the property window for the Button control, and then change the Text property to Filter Menu.
    5. Position the insertion point after the button, and then press ENTER to position the insertion point for the Xml control.
    6. Drag an Xml Web server control from the toolbox to the Web Form.
    7. Press F4 to access the property window of the Xml control. Change the DocumentSource property to Menu.xml, and then change the TransformSource property to Menu.xslt.
  7. Add the following code to the top of the code-behind page:
    Imports System.Xml.Xsl					
  8. Double-click the button to create a Click event handler in the code-behind page of the Web Form. Add the following code to the event handler:
    Dim tal As New XsltArgumentList()    tal.AddParam("calories", "", TextBox1.Text)    Xml1.TransformArgumentList = tal    Xml1.Visible = True						
    With this argument list, you can pass the value of the TextBox control as a parameter to the stylesheet. This stylesheet uses XSLT commands to filter out all lunch menu items that are greater than the calorie count that the customer types. The following line of code from the stylesheet illustrates how the parameter is received and used:
    <xsl:for-each select="lunch-menu/food[calories <= $calories]">					
  9. Use the code from the Menu.xml and the Menu.xslt sections to create the Menu.xml and the Menu.xslt files. Save these files in the same folder as WebForm1.aspx.
back to the top

Complete Code Listing


<?xml version='1.0'?><lunch-menu>  <food>    <name>Cheese Pizza</name>    <price>$6.95</price>    <description>Individual deep-dish pizza with lots of mozzarella cheese</description>    <calories>800</calories>  </food>  <food>    <name>Pepperoni Pizza</name>    <price>$7.95</price>    <description>Individual deep-dish cheese pizza with thick-cut pepperoni slices</description>    <calories>950</calories>  </food>  <food>    <name>The "Everything" Pizza</name>    <price>$9.95</price>    <description>Individual deep-dish pizza with all our toppings. House specialty!</description>    <calories>800</calories>  </food>  <food>    <name>Hungarian Ghoulash</name>    <price>$4.50</price>    <description>Large serving in a sourdough bread bowl. A_local delight!</description>    <calories>600</calories>  </food>  <food>    <name>Maisey's Pork Sandwich</name>    <price>$6.95</price>    <description>A fresh pork fillet, deep-fried to perfection. Served with fries.</description>    <calories>950</calories>  </food></lunch-menu>				
back to the top


<?xml version="1.0"?><xsl:stylesheet version="1.0"    xmlns:xsl="">    <xsl:param name="calories">1500</xsl:param>  <xsl:template match="/">    <HTML>      <BODY STYLE="font-family:Arial, helvetica, sans-serif; font-size:12pt;            background-color:#EEEEEE">        <xsl:for-each select="lunch-menu/food[calories <= $calories]">          <DIV STYLE="background-color:blue; color:white; padding:4px">            <SPAN STYLE="font-weight:bold; color:white"><xsl:value-of select="name"/></SPAN>            - <xsl:value-of select="price"/>          </DIV>          <DIV STYLE="margin-left:20px; margin-bottom:1em; font-size:10pt">            <xsl:value-of select="description"/>            <SPAN STYLE="font-style:italic">              (<xsl:value-of select="calories"/> calories per serving)            </SPAN>          </DIV>        </xsl:for-each>      </BODY>    </HTML>  </xsl:template></xsl:stylesheet>				
back to the top


<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb" Inherits="menu.WebForm1"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML>  <HEAD>    <title>WebForm1</title>    <meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0">    <meta name="CODE_LANGUAGE" content="Visual Basic 7.0">    <meta name=vs_defaultClientScript content="JavaScript">    <meta name=vs_targetSchema content="">  </HEAD>  <body >    <form id="Form1" method="post" runat="server"><P>Maximum Calories: <asp:TextBox id="TextBox1" runat="server"></asp:TextBox><asp:Button id="Button1" runat="server" Text="Filter Menu"></asp:Button></P><P><asp:Xml id="Xml1" runat="server" DocumentSource="menu.xml" TransformSource="menu.xslt"></asp:Xml></P>    </form>  </body></HTML>				
back to the top


Imports System.Xml.XslPublic Class WebForm1    Inherits System.Web.UI.Page    Protected WithEvents TextBox1 As System.Web.UI.WebControls.TextBox    Protected WithEvents Button1 As System.Web.UI.WebControls.Button    Protected WithEvents Xml1 As System.Web.UI.WebControls.Xml#Region " Web Form Designer Generated Code "    'The Web Form Designer requires this code.    <System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()    End Sub    Private Sub Page_Init(ByVal sender As System.Object, _    ByVal e As System.EventArgs) Handles MyBase.Init        'CODEGEN: The Web Form Designer requires this method call.        'Do not use the Code editor to modify it.        InitializeComponent()    End Sub#End Region    Private Sub Page_Load(ByVal sender As System.Object, _    ByVal e As System.EventArgs) Handles MyBase.Load        'Insert user code to initialize the page here.    End Sub    Private Sub Button1_Click(ByVal sender As System.Object, _    ByVal e As System.EventArgs) Handles Button1.Click        Dim tal As New XsltArgumentList()        tal.AddParam("calories", "", TextBox1.Text)        Xml1.TransformArgumentList = tal        Xml1.Visible = True    End SubEnd Class				
back to the top

Verify That It Works

  1. Press F5 to run the application in debug mode.
  2. By default, all of menu appears. Take note of the calorie counts for each item.
  3. In the text box, type a calorie amount, and then click Filter Menu. Notice that only those menu items that are less than or equal to this calorie amount appear.
  4. Press SHIFT+F5 to stop debugging and to return to Visual Studio .NET.
back to the top
For more information, visit the following Microsoft Web site:For additional information about Web server controls, click the article number below to view the article in the Microsoft Knowledge Base:
306459 INFO: ASP.NET Server Controls Overview
back to the top

Article ID: 315906 - Last Review: 02/07/2003 05:43:07 - Revision: 2.1

  • Microsoft ASP.NET 1.0
  • kbctrl kbhowtomaster kbwebforms KB315906