Menú jQuery y mapa del sitio ASP.NET

StackOverflow https://stackoverflow.com/questions/103630

  •  01-07-2019
  •  | 
  •  

Pregunta

¿Es posible utilizar un ASP.NET mapa del sitio web con jQuery Superpez ¿menú?

De lo contrario, ¿hay algún complemento independiente del navegador basado en estándares disponible que funcione con el archivo web.sitemap?

¿Fue útil?

Solución

Encontré esta pregunta mientras buscaba la misma respuesta...todos dice ¡Es posible pero nadie da la solución real!Parece que ya funciona, así que pensé en publicar mis hallazgos...

Cosas que necesitaba:

mi terminado Masterpage.master tiene lo siguiente head etiqueta:

<head runat="server">
    <script type="text/javascript" src="/script/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="/script/superfish.js"></script>
    <link href="~/css/superfish.css" type="text/css" rel="stylesheet" media="screen" runat="server" />
    <script type="text/javascript">

        $(document).ready(function() {
        $('ul.AspNet-Menu').superfish();
        }); 

</script>
</head>

Que es básicamente todo lo necesario para que funcione el menú jQuery Superfish.El interior de la página (donde va el menú) se ve así (basado en estas instrucciones):

<asp:SiteMapDataSource ID="SiteMapDataSource" runat="server"
    ShowStartingNode="false" />
<asp:Menu ID="Menu1" runat="server" 
    DataSourceID="SiteMapDataSource"
    Orientation="Horizontal" CssClass="sf-menu">
</asp:Menu>

Según la documentación, parece que DEBE funcionar, pero no es así.La razón es que el CssClass="sf-menu" se sobrescribe cuando se procesa el menú y el <ul> la etiqueta recibe un class="AspNet-Menu".Pensé que la línea $('ul.AspNet-Menu').superfish(); ayudaría, pero no fue así.

UNA COSA MÁS

Aunque es un truco (y por favor que alguien me indique la solución correcta), pude hacerlo funcionar abriendo el superfish.css archivo y buscar y reemplazar menú sf con Menú AspNet...¡y voilá!apareció el menú.Pensé que habría algún ajuste de configuración en el asp:Menu controlar dónde podría configurar el <ul> clase pero no encontré ninguna pista a través de Google.

Otros consejos

Sí, es totalmente posible.

Lo he usado con el control ASP:Menu y jQuery 1.2.6 con el complemento Superfish.Tenga en cuenta que necesitará el Adaptadores de control compatibles con ASP.NET 2.0 CSS.

ASP.NET genera el control ASP:Menu como un diseño de tabla.El Adaptador de control compatible con CSS hará que ASP.NET genere el control ASP:Menu como un diseño UL/LI dentro de un div.

Esto permitirá una fácil integración del complemento jQuery y Superfish porque el complemento Superfish se basa en un diseño UL/LI.

Parece que necesitas generar un UL para Superfish.Debería poder hacer esto con ASP.Net desde el mapa de su sitio.Creo que el control del mapa del sitio hará algo como esto.De lo contrario, debería ser bastante trivial llamar al mapa del sitio directamente desde C# y generar el DOM mediante programación.Puede crear un control de usuario para hacer esto o hacerlo en la página maestra.

Verificar este artículo de MSDN sobre cómo enumerar mediante programación los nodos en el mapa de su sitio.

Recuerde agregar clases CSS para elementos NonLink.Los elementos CSS de Superfish no los tienen en cuenta.Y si eres como yo y tienes menús raíz que no son enlaces, entonces se muestra horrible.Simplemente agregue elementos AspNet-Menu-NonLink al archivo superfish.css y debería funcionar bien.

El control SiteMapDataSource debería poder vincularse a cualquier control vinculado a datos jerárquicos.No estoy familiarizado con Superfish, pero sé que existen muchos controles jQueryish para hacer esto.

Creé un pequeño proyecto de muestra que puedes usar en http://simplesitemenu.codeplex.com/

Es un control compuesto que genera un listado UL/LI anidado a partir de su mapa de sitio.

¡Disfrutar!

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top