Menu de jQuery e ASP.NET Mapa do Site

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

  •  01-07-2019
  •  | 
  •  

Pergunta

É possível usar um ASP.NET web.sitemap com um jQuery < a href = "http://users.tpg.com.au/j_birch/plugins/superfish/" rel = "noreferrer"> menu de Superfish ?

Se não, existem padrões de navegador baseado plugins agnósticos disponíveis que funcionam com o arquivo web.sitemap?

Foi útil?

Solução

Eu encontrei esta pergunta ao olhar para a mesma resposta ... todo mundo diz é possível, mas ninguém dá a solução real! Parece-me ter que trabalhar agora então pensei que eu ia postar minhas conclusões ...

As coisas que eu precisava:

Meu Masterpage.master acabado tem a seguinte tag head: 

<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 é basicamente todo o material necessário para o menu jQuery Superfish ao trabalho. Dentro da página (onde o menu vai) se parece com isso (com base no estas instruções ): 

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

Com base na documentação, isto parece como ele deve funcionar - mas isso não acontece. A razão é que o CssClass="sf-menu" ele será substituído quando o menu é prestado ea tag <ul> recebe um class="AspNet-Menu". Eu pensei que o $('ul.AspNet-Menu').superfish(); linha ajudaria, mas isso não aconteceu.

MAIS UMA COISA

Embora seja um hack (e por favor, alguém me aponte para a solução correta) eu era capaz de fazê-lo funcionar, abrindo o arquivo superfish.css e pesquisar e substituir sf menu com ASPNet-menu ... e pronto! o menu apareceu. Eu pensei que haveria alguma definição de configuração no controle asp:Menu onde eu poderia definir a classe <ul> mas não encontrou quaisquer sugestões via google.

Outras dicas

Sim, é totalmente possível.

Eu usei-o com o ASP: Menu controle e jQuery 1.2.6 com o plugin Superfish. Note, você vai precisar do ASP.NET 2.0 CSS Friendly Controle Adaptadores .

ASP.NET gera o controle asp: menu como um layout de tabela. O CSS amigável Adapter Controle fará ASP.NET gerar o ASP:. Controle Menu como um layout UL / LI dentro de uma div

Isto irá permitir a fácil integração do jQuery e plugins Superfish porque o plugin Superfish conta com um layout UL / LI.

Parece que você precisa para gerar uma UL para Superfish. Você deve ser capaz de fazer isso com ASP.Net do seu mapa do site. Eu acho que o mapa do site controle irá fazer algo assim. Se não, que deve ser bastante trivial para chamar o mapa do site diretamente do C # e gerar o DOM programação. Você poderia construir um controle de usuário para fazer isso, ou fazê-lo na página mestra.

Confira este artigo MSDN sobre como enumerar programaticamente o nós em seu mapa do site.

Lembre-se de adicionar classes CSS para elementos NonLink. elementos css Superfish não acccont para eles. E se você é como eu e tem de menu raiz que não são links, então ele torna horrivelmente. Basta adicionar elementos ASPNet-Menu-NonLink para o arquivo superfish.css e deve tornar bem.

O controle SiteMapDataSource deve ser capaz de ligar-se a quaisquer dados hierárquicos controlo ligados. Eu não estou familiarizado com superfish mas eu sei que há uma abundância de controles jQueryish lá fora para fazer isso.

Eu criei um projeto de amostra pequeno puro você pode usar em http://simplesitemenu.codeplex.com/

É um controle composto que gera um nested UL / LI lista do seu mapa do site.

Aproveite!

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top