قم أولاً بإنشاء قائمة باسم ملف xml جديد بالمحتوى التالي:
<?xml version="1.0" encoding="utf-8" ?>
<القائمة>
<menuItem url = "~/Default.aspx" title = "الصفحة الرئيسية" description = ""/>
<menuItem url = "~/News.aspx" title = "الأخبار" description = "">
<menuItem url = "~/News.aspx" title = "الأخبار المحلية" description = ""/>
<menuItem url = "~/News.aspx" title = "الأخبار الدولية" description = ""/>
</menuItem>
</menu> ثم قم بسحب وإفلات عنصر تحكم القائمة على الصفحة، ثم قم بسحب وإفلات عنصر تحكم XmlDataSource بالمعرف XmlDataSource1، وقم بتعيين DataSourceID الخاص بالقائمة على XmlDataSource1.
قم بتكوين عنصر التحكم XmlDataSource بحيث يكون DataFile = "~/Menu.xml" XPath = "menu/menuItem"،
هنا يتم استخدام xpath لتحديد البيانات، أي لتصفية بيانات عنصر القائمة.
عند هذه النقطة، قم بربط بيانات عنصر تحكم القائمة وأخبر عنصر تحكم القائمة بكيفية عرض البيانات التي تمت تصفيتها من ملف xml. حدد عنصر تحكم القائمة، وحدد DataBindings في نافذة الخصائص، وفي مربع الحوار المنبثق، حدد MenuItem في القائمة الموجودة في الزاوية اليسرى العليا، وانقر فوق الزر Add لإضافة MenuItem إلى القائمة في الجزء السفلي الأيسر، ثم حدد MenuItem في هذه القائمة، هذه هي القائمة الصحيحة التي ستعرض الخصائص المراد ربطها، لذا NavigateUrlField="url" TextField="title". اضغط على زر موافق للعودة إلى واجهة التصميم، وفي هذا الوقت، سيتم عرض عنصري القائمة "الصفحة الرئيسية" و"الأخبار".
كود html للتصميم هو كما يلي:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="CoAffiliate._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// AR" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<رئيس التشغيل = "الخادم">
<title>صفحة بلا عنوان</title>
</الرأس>
<الجسم>
<معرف النموذج = "form1" runat = "الخادم">
<ديف>
<asp:Menu ID = "Menu1" runat = "server" DataSourceID = "XmlDataSource1" Orientation = "أفقي" StaticEnableDefaultPopOutImage = "False">
<ربط البيانات>
<asp:MenuItemBinding DataMember = "menuItem" NavigateUrlField = "url" TextField = "title" />
</DataBindings>
</asp: القائمة>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/Menu.xml" XPath="menu/menuItem"></asp:XmlDataSource>
</div>
</النموذج>
</الجسم>
</html>