ASP.Net. Лекція 11. Навігація по сайту (вихідні коди)

Лекція 10


До цих пір ми створювали окремі сторінки. Веб-додатки, які зазвичай створюються для роботи в Інтернет, складаються з великої кількості взаємозалежних сторінок. Перехід з однієї сторінки на іншу відбувається за гіперпосиланнями. На багатьох сайтах створюються різні засоби для подорожей по сторінках. Панелі навігації розташовуються у верхній частині сторінки у вигляді смуги, праворуч або ліворуч у вигляді дерева.












Курси


Навчальні програми


Підручники


Новини


Форум


Допомога


Для того, щоб спростити розробку такої функціональності, в ASP.NET 2.0 надано можливість у вигляді готових елементів управління навігації.


Site Map


Структура навігації повинна бути описана в карті сайту. Вона знаходиться у файлі. Sitemap формату XML, який можна створити в діалозі New File, вибравши пункт Site Map. Ім'я цього файлу замовчуванням – web.sitemap. Карта сайту служить джерелом інформації для всіх елементів управління групи Navigation. З нею можна працювати програмно за допомогою класу SiteMap або через елемент управління-джерело даних SiteMapDataSource.


Вузли siteMapNode можуть вкладатися один в одного, створюючи ієрархію. Логіка вкладеності вузлів ніяк не пов'язана з фізичним розташуванням файлів. Кожен атрибут url у файлі. Sitemap повинен бути унікальним.


Схема формату. Sitemap






  <?xml version=”1.0″ encoding=”utf-8″ ?>
<xs:schema xmlns:xs=”http://www.w3.org/2001/XMLSchema”
   elementFormDefault=”qualified”>
  <xs:element name=”siteMap”>
    <xs:complexType>
      <xs:sequence>
<xs:element ref="siteMapNode" maxOccurs="unbounded" />
      </xs:sequence>
    </xs:complexType>
  </xs:element>
  <xs:element name=”siteMapNode”>
    <xs:complexType>
      <xs:sequence>
<xs:element ref="siteMapNode" minOccurs="0" maxOccurs="unbounded"/>
      </xs:sequence>
      <xs:attribute name=”url” type=”xs:string” />
      <xs:attribute name=”title” type=”xs:string” />
<xs:attribute name="description" type="xs:string" />
<xs:attribute name="keywords" type="xs:string" />
      <xs:attribute name=”roles” type=”xs:string” />
<xs:attribute name="siteMapFile" type="xs:string" />
<xs:attribute name="Provider" type="xs:string" />
    </xs:complexType>
  </xs:element>
</xs:schema>

Щоб зробити карту сайту доступною для елементів управління, використовується провайдер типу XmlSiteMapProvider. Можна розробити власний провайдер.


Редагування карти сайту в Visual Studio 2005 полегшується за допомогою технології IntelliSense.


Атрибут title вузла карти сайту створює текстовий опис сторінки. Він використовується як текст гіперпосилання, що створюється в TreeView або Menu. Атрибут description задає текст підказки (Tooltip), пов'язаної з цією гіперпосиланням. Атрибут url описує шлях до сторінки всередині веб-сайту. При цьому для сторінок в кореневій директорії досить вказати їх назву. Якщо сторінка знаходиться в піддиректорії, шлях вказується за допомогою прямого слеша.






  <?xml version=”1.0″ encoding=”utf-8″ ?>
<siteMap>
      <siteMapNode title=”Home” url=”Default.aspx”>
<siteMapNode title="Resume" url="Resume.aspx" />
<siteMapNode title="Links" url="Links.aspx" />
<siteMapNode title="Albums" url="Albums.aspx">
<siteMapNode title="Photos" url="Photos.aspx">
<siteMapNode title="Details" url="Details.aspx" />
                  </siteMapNode>
            </siteMapNode>
<siteMapNode title="Register" url="Register.aspx" />
<siteMapNode title="Manage" url="Admin/Albums.aspx">
<siteMapNode title="Photos" url="Admin/Photos.aspx">
<siteMapNode title="Details" url="Admin/Details.aspx" />
                  </siteMapNode>
            </siteMapNode>
      </siteMapNode>
</siteMap>

Елементи керування для навігації по сайту – Treeview, Menu, SiteMenuPath.


Деякі елементи навігації можуть працювати з картою безпосередньо, наприклад, SiteMenuPath, але Menu і Treeview можуть показувати карту сайту, тільки одержуючи дані з SiteMapDataSource.


Елемент управління SiteMapPath


Подібну панель, яка показує шлях від головної сторінки до поточної, часто називають breadcrumb (хлібні крихти).


MSDN Home> ASP.NET Developer Center> Reference> Using ASP.NET Controls


Ймовірно, це пов'язано з казкою про хлопчика-с-Пальчик, який кидав хлібні крихти по дорозі в ліс, щоб знайти шлях додому. Користувач великого і складного веб-сайту теж повинен знати, де він знаходиться, і не загубитися в лабіринті. Тому можна назвати цей елемент ще й ниткою Аріадни. Він складається з послідовності гіперпосилань на всі вищі вузли сайту. Поточна сторінка відображена простим текстом. Цю настройку можна змінити, встановивши властивість RenderCurrentNodeAsLink в True.


Для того, щоб на сторінці працював цей елемент, навіть не потрібно джерела даних. Він автоматично читає карту сайту з файлу Web.sitemap. Досить просто перетягнути його на сторінку. Є 4 властивості стилю, кожен з яких задається окремо: для кореневого елемента, для роздільника, звичайного вузла та поточного вузла. У SiteMapPath є така ж можливість автоформатування, як і в багатьох інших елементів управління.


Властивість PathDirection дозволяє змінити напрямок від кореня до поточної сторінці на зворотне. Наприклад, якщо у вас був таким:


Головна: Гра: Таблиця


, То після зміни значення PathDirection на CurrentToRoot стане таким:


Таблиця: Гра: Головна


Текстовий атрибут PathSeparator задає роздільник між вузлами. Наприклад, у першому прикладі це ">", який ставиться за замовчуванням, а в другому ":". Прогалини тут істотні. Схожі атрибути був і в календарі – наприклад NextMonthText. Для того, щоб задати зображення, як роздільник, можна використовувати шаблон PathSeparatorTemplate.






 <asp:SiteMapPath ID="SiteMapPath1" runat="server">
      <PathSeparatorTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="img/folder.gif" />
      </PathSeparatorTemplate>
    </asp:SiteMapPath>

Властивість ParentLevelsDisplayed дозволяє обмежити кількість відображуваних батьківських вузлів. Якщо воно дорівнює -1 (за замовчуванням), то показуються всі вузли.


Якщо потримати курсор миші над елементом, з'явиться підказка, текст якої береться з атрибуту description відповідного вузла карти сайту. Відключити відображення підказки можна за допомогою властивості ShowToolTips = "false".


Усього є 4 шаблону: PathSeparatorTemplate, NodeTemplate, RootTemplate і CurrentNodeTemplate, за допомогою яких можна вставляти будь-які елементи управління в різні частини SiteMapPath. Для кожної з частин можна визначити і власний стиль.


SiteMapDataSource


Джерело даних SiteMapDataSource працює за допомогою провайдера SiteMapProvider. Це джерело даних не підтримує кешування, як інші. Він може бути пов'язаний тільки з файлом карти сайту.


У найпростішому вигляді оголошується так:






 <asp:SiteMapDataSource ID="SiteMapDataSource1" Runat="server" />

Властивість ShowStartingNode визначає, чи буде елемент читати кореневий вузол карти сайту. Якщо не встановлено, то в колекцію вузлів потраплять лише дочірні елементи кореневого вузла.


StartFromCurrentNode = False задає можливість читати тільки вузли, починаючи з поточної сторінки.


Властивість FlatDepth задає кількість рівнів вкладеності, яке читається з карти сайту. За умовчанням це -1, тобто читаються всі доступні рівні.


SiteMapProvider може бути корисним при написанні власних провайдерів карти сайту.


SiteMapViewType визначає форму подання вузлів. За умовчанням це Tree. Якщо значення дорівнює Path, то буде читатися шлях між початком вузлом і поточним, як в елементі управління SiteMapPath.


TreeView


Елемент TreeView створений спеціально для показу ієрархічної інформації. Він може черпати інформацію як з будь-якого XML-файлу через XmlDataSource, так і з карти сайту за допомогою SiteMapDataSource. Як випливає з його назви, TreeView показує дані у вигляді дерева, причому його вузли можна розкривати і закривати, вибирати окремі «листя». При цьому будуть запускатися події, які можна обробити.


TreeView складається з вузлів, які з'єднані між собою відносинами «батько-нащадок". В одного батька може бути один або кілька нащадків. Вузли, у яких немає батька, називаються кореневими. Їх в елементі управління може бути декілька. Вузли, у яких немає нащадків, називаються листям.


При декларації TreeView на сторінці вузли описуються тегами TreeNode. Допускається будь-який рівень вкладеності вузлів один в одного. Вузли елемента керування можна редагувати візуально






 <asp:TreeView ID="TreeLibrary" runat="server" ImageSet="WindowsHelp">
   <Nodes>
<asp:TreeNode Text="Категоріі кніг" Value="Book Categories">
<asp:TreeNode Text="Художественная література" Value="literature">
<asp:TreeNode Text="Русская классіка" Value="Russian Classics" NavigateUrl="~/libru.aspx?id=1">
<asp:TreeNode Text="Пушкін" Value="Pushkin" NavigateUrl="~/libru.aspx?id=1&auth=10">
               </asp:TreeNode>
            </asp:TreeNode>
         </asp:TreeNode>
<asp:TreeNode Text="Компьютерная література" Value="Computers">
<asp:TreeNode Text="Web Development" Value=" Web Development" NavigateUrl="~/example1.aspx?id=1">
<asp:TreeNode Text="JavaScript" Value=" JavaScript "NavigateUrl="~/example1.aspx?id=2">
               </asp:TreeNode>
<asp:TreeNode Text="ASP.NET" Value="ASP.NET" NavigateUrl="~/example1.aspx?id=3"> </ asp: TreeNode>
            </asp:TreeNode>
         </asp:TreeNode>
      </asp:TreeNode>
   </Nodes>
</asp:TreeView>

Якщо потрібно програмно додавати дочірні вузли, властивість PopulateOnDemand потрібно встановити в true.


Зовнішній вигляд TreeView можна міняти найрізноманітнішим способом. Можна включити показ ліній, що з'єднують вузли.






  ShowLines=”True”

Зовнішній вигляд ліній можна відредагувати, при цьому за допомогою засобу TreeView Line Generator будуть створені зображення для всіх її фрагментів.


Замість тексту у вузлах можна показувати зображення, задані властивістю ImageUrl.


Властивість ImageSet має набір визначених значків для різних типів вузлів. Наприклад, MSDN додасть вашому дереву схожість з TreeView на сайті msdn.com, а XPFileExplorer з програмою Explorer в Windows XP.

Після цього потрібно налаштувати способи показу даних. За замовчуванням він буде показувати назви вузлів, а не їх внутрішній зміст. У SmartTag виберіть пункт Edit TreeNode Databindings. У результаті в редакторі повинен з'явитися приблизно такий текст.






 <Asp: XmlDataSource ID = "XmlDataSource1" runat = "server"
        DataFile=”~/FilmChoices.xml”
XPath = "FilmChoices / Film"> </ asp: XmlDataSource>
<asp:TreeView ID=”TreeView1″ runat=”server”
    DataSourceID=”XmlDataSource1″ Width=”405px”>
    <DataBindings>
<asp:TreeNodeBinding DataMember="Film" TextField="Title" />
<asp:TreeNodeBinding DataMember="Year" FormatString="Год {0}" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Director" FormatString="Режіссер {0}" TextField="#InnerText" />
    </DataBindings>
</asp:TreeView>

Значення TextField використовується, якщо потрібно показати значення атрибутів вузла у вихідному XML-файлі, а # InnerText вказує текст між відкривають і закривають текамі вузла.


Якщо вибираємо джерелом даних SiteMap, то на сторінці створюється ще один елемент керування SiteMapDataSource.






 <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<Asp: TreeView ID = "TreeView1" runat = "server" DataSourceID = "SiteMapDataSource1"
ShowLines = "True" BackColor = "WhiteSmoke" BorderStyle = "Outset"
ImageSet = "BulletedList" Font-Names = "Verdana" Font-Overline = "False"
    ForeColor=”#804040″ Width=”199px” >
</asp:TreeView>

На сторінці елемент TreeView буде виглядати так:

Змістовна частина цього меню знаходиться у файлі карти сайту, а форматування проводиться у властивостях TreeView. Властивість AutoGenerateDataBindings дозволяє автоматично заповнювати вузли інформацією з карти сайту.


Програмне управління TreeView.


У TreeView є безліч подій. Подія SelectedNodeChanged запускається, коли користувач вибирає вузол.






 protected void TreeLibrary_SelectedNodeChanged (object sender, EventArgs e)
    {
Label1.Text = "Ви вибрали категорію" + TreeLibrary.SelectedNode.Text;
    }

Можна програмно розкривати і закривати вузли.






  TreeView1.ExpandAll();
TreeView1.CollapseAll();

Подія TreeNodePopulate дозволяє динамічно заповнювати вузли, при цьому можна економити пам'ять, якщо заповнювати вузли тільки на вимогу після расритія батьківського вузла. Подія TreeNodePopulate викликається, якщо дія (наприклад, розкриття) проведено з вузлом, у якого SelectAction налаштований на цю дію.


У наступному прикладі заповнимо значення елемента управління TreeView з бази даних Northwind. Батьківські вузли – категорії продуктів, які заповнюються даними про продукти тоді, коли вузол необхідно розкрити.






 <Asp: TreeView ID = "TreeViewCatProd" runat = "server" ImageSet = "BulletedList3"
OnTreeNodePopulate = "TreeViewCatProd_TreeNodePopulate" ForeColor = "DarkOliveGreen">
      </asp:TreeView>
public partial class Products : System.Web.UI.Page
{
string connectionString = @ "Data Source =. SQLEXPRESS; Initial Catalog = Northwind; Integrated Security = True";
  protected void Page_Load(object sender, EventArgs e)
  {
    if (!Page.IsPostBack)
    {
      BindData();
    }
  }

Допоміжна функція встановлює з'єднання з базою даних і повертає SqlDataReader – найшвидший спосіб читання даних.






 protected SqlDataReader CreateSqlDataReader (string SelectQuery, string ConnectionString)
  {
SqlConnection Connection = new SqlConnection (ConnectionString);
SqlCommand Command = new SqlCommand (SelectQuery, Connection);
    try
    {
      Command.CommandType = CommandType.Text;
      Command.Connection.Open();
SqlDataReader reader = Command.ExecuteReader (CommandBehavior.CloseConnection);
      return reader;
    }
    catch
    {
      Connection.Close();
      return null;
    }
  }

При роботі з базами даних важливо перехоплювати винятку.






    protected void BindData()
  {
    TreeNode parentNode = null;
SqlDataReader reader = CreateSqlDataReader ("Select CategoryID, CategoryName from Categories", connectionString);
    if (reader!=null)
    {
      while (reader.Read())
      {
parentNode = new TreeNode (reader ["CategoryName"]. ToString (), reader ["CategoryID"]. ToString ());
        parentNode.Collapse();
        parentNode.PopulateOnDemand = true;
parentNode.SelectAction = TreeNodeSelectAction.Expand;
        TreeViewCatProd.Nodes.Add(parentNode);
      }
      reader.Close();
    }
 }

Конструктор TreeNode може викликатися без параметрів, але він перевантажений. Варіант, який тут використовується, дозволяє задати текст вузла і значення Value (заповнюється значенням CategoryID), яка необхідна, щоб знайти в базі продукти цієї категорії.


При розкритті вузла з категорією буде викликатися обробник.






 protected void TreeViewCatProd_TreeNodePopulate (object sender, TreeNodeEventArgs e)
  {
    TreeNode node = e.Node;
    if (node.PopulateOnDemand)
    {
string command = string.Format ("Select ProductID, ProductName from Products where CategoryID = {0}", node.Value);
SqlDataReader reader = CreateSqlDataReader (command, connectionString);
      node.ChildNodes.Clear();
      if (reader != null)
      {
        while (reader.Read())
        {
TreeNode childNode = new TreeNode (reader ["ProductName"]. ToString ());
childNode.SelectAction = TreeNodeSelectAction.None;
          node.ChildNodes.Add(childNode);
        }
        node.Expand();
        reader.Close();
      }
    }
  }

TreeView дозволяє не тільки показувати інформацію, але ставити прапорці поруч з вузлами. Це корисно, якщо в ньому міститься інформація про товари, при цьому користувач може вибрати деякі з них. Властивість ShowCheckBoxes допускає 5 значень: None, Root, Parent, Leaf, All.






  ShowCheckBoxes=”Leaf”

При цьому поряд з вузлами-листям з'являються прапорці. Значення прапорців можна прочитати програмно.






 <asp:XmlDataSource ID="XmlDataSource3" runat="server" DataFile="~/menu.xml"> </ asp: XmlDataSource>
<Asp: TreeView ID = "TreeMenu" runat = "server" DataSourceID = "XmlDataSource3" BackColor = "# FFFBD6"
Font-Names = "Verdana" Font-Size = "0.8em" ForeColor = "# 990000" Height = "78px"
Width = "415px" ShowCheckBoxes = "Parent" OnTreeNodeCheckChanged = "TreeMenu_TreeNodeCheckChanged"
   NodeWrap=”True” PopulateNodesFromClient=”False”>
   <DataBindings>
<asp:TreeNodeBinding DataMember="name" ValueField="#InnerText" />
<Asp: TreeNodeBinding DataMember = "price" FormatString = "{0} руб."
<TextField="#InnerText" ValueField="#InnerText" />
<asp:TreeNodeBinding DataMember="description" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="calories" FormatString="{0} калорій" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="food" TextField="name" />
<asp:TreeNodeBinding DataMember="pizza_menu" Text="Меню Піцци" Value="Меню Піцци" />
   </DataBindings>
</asp:TreeView>
<asp:Label ID="Label1" runat="server"> </ asp: Label>

Прапорці стоять біля батьківських вузлів, тому що саме там знаходяться назви страв. У обробнику можна динамічно показувати суму поточного замовлення.






 protected void TreeMenu_TreeNodeCheckChanged (object sender, TreeNodeEventArgs e)
    {
        decimal sumPrices=0.0M;
        if (TreeMenu.CheckedNodes.Count > 0)
        {
            Label1.Text = “”;
            foreach (TreeNode node in TreeMenu.CheckedNodes)
            {
sumPrices + = decimal.Parse (node.ChildNodes [0]. Value);
            }
Label1.Text = sumPrices.ToString () + "<br>";
        }
    }

Ціна записана в першому дочірньому поле з індексом 0. При цьому звертатися властивість Text було б неправильно, тому що там знаходиться відформатований текст, наприклад «306 руб.», Який не можна перетворити на число.


Елемент управління Menu


Меню, що випадає можна створити засобами одного тільки css. Це гарне рішення, але вимагає великого об'єму коду. Також необхідно передбачити можливість перегляду різними браузерами. Більшість розробників створюють меню за допомогою JavaScript. У ASP.NET 2.0 створення випадаючого меню будь-якого рівня вкладеності вимагає всього 2 рядків.






 <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1"> </ asp: Menu>

Вся інша робота дістається ASP.NET. А її багато, щоб переконатися в це, подивіться згенерований код в браузері.


Menu ідеальний для відображення великої кількості ієрархічної інформації. Займаючи мало місця, вузли меню розкриваються при наведенні курсору миші. Стрілка поруч із пунктом меню означає, що в ньому є підменю. Замість стрілки можна використовувати зображення, задавши властивість DynamicPopOutImageUrl. Картинки також можна використовувати як роздільники між пунктами меню.


Menu допускає горизонтальну і вертикальну орієнтацію, яка задається властивістю Orientation. При горизонтальній орієнтації можна отримати смужку меню. Меню складається з статичної та динамічної частин, кожен зі своїм набором стилів.




















StaticHoverStyle


DynamicHoverStyle


StaticMenuItemStyle


DynamicMenuItemStyle


StaticMenuStyle


DynamicMenuStyle


StaticSelectedStyle


DynamicSelectedStyle


StaticTemplate


DynamicTemplate


Стилі можна поміняти «одним махом» за допомогою автоформатування.


Статичні пункти відображаються постійно, а динамічні при виборі батьківських вузлів. Для цього автоматично генерується код JavaScript.


Властивість StaticDisplayLevels за замовчуванням дорівнює 1, тобто показуються тільки головні пункти меню, а інші з'являються в момент наведення мишки. Якщо це значення змінити, отримаємо статичну багаторівневе меню. На сторінці різні меню можна прив'язати до різних джерел SiteMapDataSource, тоді при одній карті сайті вони будуть показувати його різні підмножини.






  <?xml version=”1.0″ encoding=”utf-8″ ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
  <siteMapNode title=”Main” >
<siteMapNode title=" Главная" url="Default.aspx">
<siteMapNode url="courses.aspx" title="Курси" description="Курси" />
<siteMapNode url="speciality.aspx" title="Учебние программи" description="" />
<siteMapNode url="shop.aspx" title="Учебнікі" description="" />
<siteMapNode url="News.aspx" title="Новості" description="" />
<siteMapNode url="Forum.aspx" title="Форум"/>
<siteMapNode url="Help.aspx" title="Помощь"/>
    </siteMapNode>
    <siteMapNode title=”user” url=”Default2.aspx”>
<siteMapNode url="login.aspx" title="Регістрація" description="" />
      <siteMapNode title=”//” >
<siteMapNode url="records.aspx" title="Зачетка" description="" />
<siteMapNode url="diploms.aspx" title="Діпломи" description="" />
      </siteMapNode>
      <siteMapNode title=”//” >
<siteMapNode url="user.aspx" title="Настройкі" description="" />
<siteMapNode url="cart.aspx" title="Корзіна"/>
<siteMapNode url="history.aspx" title="Закази"/>
<siteMapNode url="account.aspx" title="Лічний счет"/>
      </siteMapNode>
    </siteMapNode>
  </siteMapNode>
</siteMap>

Одне з меню повинне показувати розділи сайту, друге – можливості користувача.






 <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" StartingNodeUrl="~/Default.aspx" />
<Asp: Menu ID = "Menu1" runat = "server" BackColor = "# FFFBD6" DataSourceID = "SiteMapDataSource1" DynamicHorizontalOffset = "2"
Font-Names = "Verdana" Font-Size = "0.8em" ForeColor = "# 990000" StaticSubMenuIndent = "10px" Orientation = "Horizontal">
<StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<DynamicHoverStyle BackColor="#990000" ForeColor="White" />
        <DynamicMenuStyle BackColor=”#FFFBD6″ />
        <StaticSelectedStyle BackColor=”#FFCC66″ />
        <DynamicSelectedStyle BackColor=”#FFCC66″ />
<DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<StaticHoverStyle BackColor="#990000" ForeColor="White" />
    </asp:Menu>
<Asp: SiteMapDataSource ID = "SiteMapDataSource2" runat = "server" ShowStartingNode = "False"
        StartingNodeUrl=”~/Default2.aspx” />
     </div>
<Asp: Menu ID = "Menu2" runat = "server" DataSourceID = "SiteMapDataSource2"
Orientation = "Horizontal" BackColor = "# F7F6F3" DynamicHorizontalOffset = "2"
Font-Names = "Verdana" Font-Size = "0.8em" ForeColor = "# 7C6F57" StaticSubMenuIndent = "10px" StaticDisplayLevels = "2">
<StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<DynamicHoverStyle BackColor="#7C6F57" ForeColor="White" />
        <DynamicMenuStyle BackColor=”#F7F6F3″ />
        <StaticSelectedStyle BackColor=”#5D7B9D” />
        <DynamicSelectedStyle BackColor=”#5D7B9D” />
<DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<StaticHoverStyle BackColor="#7C6F57" ForeColor="White" />
    </asp:Menu>

Пункти меню можуть бути описані на сторінці, а також додані програмно.






      <asp:Menu ID=”Menu3″ runat=”server”
BackColor = "# B5C7DE" DynamicHorizontalOffset = "2" Font-Names = "Verdana"
Font-Size = "0.8em" ForeColor = "# 284E98" StaticDisplayLevels = "3"
    StaticSubMenuIndent=”30px”>
        <Items>
<asp:MenuItem Text="Настройкі" Value="Настройкі" Selectable="false">
<asp:MenuItem Text="Анкета" Value="Анкета"> </ asp: MenuItem>
<asp:MenuItem Text="Подпіска" Value="Подпіска"> </ asp: MenuItem>
<asp:MenuItem Text="Пароль" Value="Пароль"> </ asp: MenuItem>
            </asp:MenuItem>
        </Items>
    </asp:Menu>

Коли елемент управління прив'язаний до карти сайту, то пункти меню являють собою гіперпосилання на сторінки. Подія MenuItemClick дозволяє визначити поведінку сторінки при виборі пунктів меню, коли він заповнюється іншими способами, наприклад, через XmlDataSource. У пункті MenuEventArgs знаходиться інформація і про обраний пункті, і про батьківський вузлі.






  <script runat=”server”>
protected void Menu1_MenuItemClick (object sender, MenuEventArgs e)
   {
Listbox1.Items.Add (e.Item.Parent.Value + ":" + e.Item.Value);
   }
</script>

Висновок


Багаті можливості системи навігації ASP.NET 2.0 дозволяють відокремити логічне представлення карти сайту від його візуального представлення, заощадити час на розробку.

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*