Microsoft KB Archive/315906

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

Article ID: 315906

Article Last Modified on 2/7/2003

-

APPLIES TO


 * Microsoft ASP.NET 1.0

-



This article was previously published under Q315906



IN THIS TASK
SUMMARY Requirements Display an XML Document from .NET Complete Code Listing
 * Menu.xml
 * Menu.xslt
 * WebForm1.aspx
 * WebForm1.vb

Verify That It Works REFERENCES



SUMMARY
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

Requirements
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.  Create a Visual Basic Web application as follows:  Start Microsoft Visual Studio .NET, point to New, and then click Project. Under Project Types, click Visual Basic Projects. Under Templates, click ASP.NET Web Application. In the Name box, type Menu, and then click OK.  Make sure that the Solution Explorer window is visible. If this window is not visible, press CTRL+ALT+L. WebForm1.aspx should be open in Design View. If not, double-click WebForm1.aspx in Solution Explorer.</li> Press the F4 key to access the property page. Change the pageLayout property to FlowLayout.</li> On the Web Form, type Maximum Calories: .</li> Add a TextBox control, a Button control, and an Xml control to the form as follows:  Press CTRL+ALT+X to open the toolbox.</li> In the toolbox, click Web Forms.</li> Drag a TextBox control and a Button control from the toolbox to the Web Form.</li> Press F4 to access the property window for the Button control, and then change the Text property to Filter Menu .</li> Position the insertion point after the button, and then press ENTER to position the insertion point for the Xml control.</li> Drag an Xml Web server control from the toolbox to the Web Form.</li> 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 .</li></ol> </li>  Add the following code to the top of the code-behind page: Imports System.Xml.Xsl </li>  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(&quot;calories&quot;, &quot;&quot;, 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=&quot;lunch-menu/food[calories <= $calories]&quot;> </li> 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.</li></ol>

back to the top

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

950 </lunch-menu> back to the top

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

WebForm1.aspx
<%@ Page Language=&quot;vb&quot; AutoEventWireup=&quot;false&quot; Codebehind=&quot;WebForm1.aspx.vb&quot; Inherits=&quot;menu.WebForm1&quot;%> <!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.0 Transitional//EN&quot;> <HTML> <HEAD> WebForm1 <meta name=&quot;GENERATOR&quot; content=&quot;Microsoft Visual Studio.NET 7.0&quot;> <meta name=&quot;CODE_LANGUAGE&quot; content=&quot;Visual Basic 7.0&quot;> <meta name=vs_defaultClientScript content=&quot;JavaScript&quot;> <meta name=vs_targetSchema content=&quot;http://schemas.microsoft.com/intellisense/ie5&quot;> </HEAD>

<form id=&quot;Form1&quot; method=&quot;post&quot; runat=&quot;server&quot;> <P>Maximum Calories: <asp:TextBox id=&quot;TextBox1&quot; runat=&quot;server&quot;></asp:TextBox> <asp:Button id=&quot;Button1&quot; runat=&quot;server&quot; Text=&quot;Filter Menu&quot;></asp:Button></P> <P> <asp:Xml id=&quot;Xml1&quot; runat=&quot;server&quot; DocumentSource=&quot;menu.xml&quot; TransformSource=&quot;menu.xslt&quot;></asp:Xml></P>

</HTML> back to the top

WebForm1.vb
Imports System.Xml.Xsl

Public 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


 * 1) Region &quot; Web Form Designer Generated Code &quot;

'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


 * 1) 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(&quot;calories&quot;, &quot;&quot;, TextBox1.Text) Xml1.TransformArgumentList = tal Xml1.Visible = True End Sub End 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

<div class="references_section">