ASP.NET Web Forms - Navegación

ASP.NET tiene controles de navegación integrados.

Navegación del sitio

Mantener los menús de sitios web grandes es difícil y requiere mucho tiempo.

En ASP.NET, los menús se pueden almacenar en archivos, lo que facilita su mantenimiento. El archivo suele llamarseweb.sitemap, y se almacena en el directorio raíz del sitio web.

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

  • Dynamic menus
  • TreeViews
  • Site Map Path

Archivo Sitemap

En este tutorial, se utiliza el siguiente archivo sitemap:

<?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 el archivo sitemap:

  • El archivo XML debe contener etiquetas <siteMap> alrededor del contenido.
  • La etiqueta <siteMap> solo puede tener un nodo hijo <siteMapNode> (la página "home").
  • Cada <siteMapNode> puede tener múltiples nodos hijos (páginas web).
  • Cada <siteMapNode> tiene atributos que definen el título de la página y la URL.

lampNotas:El archivo sitemap debe ubicarse en el directorio raíz del sitio, y los atributos URL deben ser relativos a ese directorio raíz.

Menú dinámico

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

Ejemplo de código:

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

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

En el ejemplo anterior, el<asp:Menu>control es un marcador de posición para que el servidor cree un menú de navegación.

La fuente de datos del control se define mediante elDataSourceIdatributo.id="nav1"Conecte la fuente de datos al<asp:SiteMapDataSource>control.

<asp:SiteMapDataSource>El control se conecta automáticamente al archivo sitemap predeterminado (web.sitemap）。

TreeView

El control <asp:TreeView> puede mostrar un menú de navegación de varios niveles.

Este menú se ve como un árbol con ramas y hojas, y se puede abrir o cerrar con los símbolos + o -.

Ejemplo de código:

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

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

En el ejemplo anterior, el<asp:TreeView>control es un marcador de posición para que el servidor cree un menú de navegación.

La fuente de datos del control se define mediante elDataSourceIdatributo.id="nav1"Conecte la fuente de datos al<asp:SiteMapDataSource>control.

<asp:SiteMapDataSource>El control se conecta automáticamente al archivo sitemap predeterminado (web.sitemap）。

SiteMapPath

El control SiteMapPath puede mostrar un puntero a la página actual (ruta de navegación). Esta ruta se muestra como enlaces en los que se puede hacer clic que apuntan a las páginas principales.

A diferencia de los controles TreeView y Menu, el control SiteMapPathno usaSiteMapDataSource. El control SiteMapPath utiliza el archivo web.sitemap de forma predeterminada.

lampConsejo: Si SiteMapPath no se muestra correctamente, probablemente se deba a un error de URL (error tipográfico) en el archivo web.sitemap.

Ejemplo de código:

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

En el ejemplo anterior, el<asp:SiteMapPath>control es un marcador de posición para que el servidor cree un menú de navegación.

Otras extensiones