Domanda

Sono relativamente nuovo su Jquery e JSON e questo è il mio primo post qui, per favore abbi pazienza.

Ho una stringa di menu JSON con una matrice di tre elementi (nome, url, id - il nostro numero ID della pagina interna) e la navigazione di livello superiore si sviluppa bene. Eseguo il ciclo tra gli elementi di livello superiore e chiamo una funzione ricorsiva per ottenere i sottomenu.

Quello che sto cercando di fare ora è in una parte separata della pagina Web, utilizzare la stringa di menu JSON per trovare una pagina di livello superiore (news.aspx, ad esempio) e creare un menu per quella pagina e il relativo sottomenu elementi da mostrare nella navigazione a sinistra che devono essere visualizzati solo nelle pagine delle notizie.

Il problema che sto riscontrando è che questo script di seguito funziona senza errori Javascript, tuttavia sta spostando la navigazione di livello superiore. La navigazione di livello superiore si chiama essenzialmente allo stesso modo, tranne per il fatto che le funzioni sono CreateMenu () e CreateMenuRecursive ().

Parte del codice che sto usando qui è stato ottenuto leggendo altri post su questo sito, ma non ho trovato una risposta a questo. Grazie in anticipo per qualsiasi aiuto.

<div id="LeftNavDiv">&nbsp;</div> 

<script type="text/javascript">
$(function(){   
var sidemenuString = CreateSideMenu();
$("#LeftNav").html(sidemenuString);
});

function CreateSideMenu(){
$.get("menu");
var sidenavHTML = new Sys.StringBuilder();
for(var i=0; i < menu.MenuItem.length; i++){
    if(menu.MenuItem[i].id == 'a123456'){
        CreateSideMenuRecursive(menu.MenuItem[i],sidenavHTML);
    }
}
return sidenavHTML.toString();
}

function CreateSideMenuRecursive(item, outputHTML){
if(item.MenuItem == null || item.MenuItem.length == 0)
return;

outputHTML.append("<ul>");
for(var i=0; i < item.MenuItem.length; i++){
    if(item.MenuItem[i].id == CurrentPageID){
        outputHTML.append("<li><a href='" + item.MenuItem[i].url + "'>" + item.MenuItem[i].label + "</a>");
    } 
    CreateSideMenuRecursive(item.MenuItem[i], outputHTML);
    outputHTML.append("</li>");
}
outputHTML.append("</ul>");
}
</script>
È stato utile?

Soluzione

A quanto pare, lo stavo rendendo troppo complicato. Tutto quello che dovevo fare era trovare l'href (news.aspx) dalla stringa del menu JSON e ottenere il sottomenu. Ho preso quello che avevo sopra e lo ho distillato fino a queste poche righe di codice:

<div id="LeftNavDiv"></div>
<script type="text/javascript">
$(function(){   
var sidemenu = $("a[href$='news.aspx']").next("ul").get();
$("#LeftNavDiv").html(sidemenu);    
});
</script>

Crea dinamicamente questo div ed elenco non ordinato tirando persino lo stile, cioè "menu-top" dalla stringa di menu JSON:

<div id="LeftNavDiv">
    <ul>
        <li class="menu-top"/>
        <li><a href="sandbox1.aspx">Lorem ipsum</a></li>
        <li class="menu-bot"/>
   </ul>
</div>
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top