Los últimos tutoriales de desarrollo web
 

ASP.NET Formas de navegación web -


ASP.NET ha incorporado en los controles de navegación


Navegación en el sitio Web

Mantener el menú de un sitio Web grande es difícil y lleva mucho tiempo.

En ASP.NET el menú se puede almacenar en un archivo para que sea más fácil de mantener. Este archivo normalmente se llama web.sitemap , y se almacena en el directorio raíz de la web.

Además, ASP.NET tiene tres nuevos controles de navegación:

  • menús dinámicos
  • TreeViews
  • Mapa del sitio Path

El mapa del sitio Archivo

El archivo de mapa siguiente se utiliza en este tutorial:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<siteMap>
  <siteMapNode title="Home" url="/aspnet/w3home.aspx">
    <siteMapNode title="Services" url="/aspnet/w3services.aspx">
      <siteMapNode title="Training" url="/aspnet/w3training.aspx"/>
      <siteMapNode title="Support" url="/aspnet/w3support.aspx"/>
    </siteMapNode>
  </siteMapNode>
</siteMap>

Reglas para crear un archivo de mapa del sitio:

  • El archivo XML debe contener un <siteMap> etiqueta que rodea el contenido
  • La <siteMap> etiqueta sólo puede tener un <siteMapNode> nodo hijo (the "home" page)
  • Cada <siteMapNode> puede tener varios nodos secundarios (web pages)
  • Cada <siteMapNode> tiene los atributos que definen título de la página y la URL

Note: El archivo de mapa del sitio debe ser colocado en el directorio raíz de la web y las URL atributos debe ser relativa al directorio raíz.


Dynamic Menu

El <asp:Menu> control muestra un menú de navegación del sitio estándar.

Code Example:

<asp:SiteMapDataSource id="nav1" runat="server" />

<form runat="server">
<asp:Menu runat="server" DataSourceId="nav1" />
</form>

El <asp:Menu> control en el ejemplo anterior es un marcador de posición para un menú de navegación del servidor creado.

La fuente de datos del control se define por la DataSourceId atributo. El id="nav1" lo conecta a la <asp:SiteMapDataSource> control.

El <asp:SiteMapDataSource> control conecta automáticamente al archivo por defecto del sitio ( web.sitemap ) .

Haga clic aquí para ver una demostración del menú, TreeView, y SiteMapPath


Vista de árbol

El <asp:TreeView> de control muestra un menú de navegación de múltiples niveles.

El menú se parece a un árbol con ramas que se pueden abrir o cerrar con el símbolo + o -.

Code Example:

<asp:SiteMapDataSource id="nav1" runat="server" />

<form runat="server">
<asp:TreeView runat="server" DataSourceId="nav1" />
</form>

El <asp:TreeView> control en el ejemplo anterior es un marcador de posición para un menú de navegación del servidor creado.

La fuente de datos del control se define por la DataSourceId atributo. El id="nav1" lo conecta a la <asp:SiteMapDataSource> control.

El <asp:SiteMapDataSource> control conecta automáticamente al archivo por defecto del sitio ( web.sitemap ) .

Haga clic aquí para ver una demostración del menú, TreeView, y SiteMapPath


SiteMapPath

El control SiteMapPath muestra el sendero (navigation path) a la página actual. La trayectoria actúa como hacer clic en enlaces a páginas anteriores.

A diferencia del control TreeView y el control de menú SiteMapPath qué NOT usar un SiteMapDataSource. El control SiteMapPath utiliza el archivo web.sitemap por defecto.

Consejos: Si el SiteMapPath muestra incorrectamente, lo más probable es que hay un error de URL (typo) en el archivo web.sitemap.

Code Example:

<form runat="server">
<asp:SiteMapPath runat="server" />
</form>

El <asp:SiteMapPath> control en el ejemplo anterior es un marcador de posición para una pantalla de ruta del sitio servidor creado.

Haga clic aquí para ver una demostración del menú, TreeView, y SiteMapPath