JSON-Menü Der Versuch, in einer anderen Funktion für den Zugriff auf eine linke Seite Navigation bauen

Question

Ich bin relativ neu auf JQuery und JSON und dies ist mein erster Beitrag hier, bitte Geduld mit mir.

Ich habe ein JSON-Menü Zeichenfolge mit einer Reihe von drei Elementen (Name, URL, id - unsere internen Seiten-ID-Nummer) und die Top-Level-Navigation baut aus fein. I Schleife durch die Top-Level-Elemente und rufen Sie eine rekursive Funktion die Untermenüs zu gelangen.

Was ich versuche jetzt zu tun ist, in einem separaten Teil der Web-Seite, verwenden Sie das JSON-Menü Zeichenfolge, die eine Top-Level-Seite zu finden (news.aspx, zum Beispiel) und ein Menü für die Seite erstellen und es ist Untermenü Elemente in einer linken Navigation zu zeigen, die nur auf den News-Seiten angezeigt werden.

Das Problem, das ich habe, ist dieses Skript unten ohne Javascript-Fehler funktioniert aber es ist die oberste Ebene Navigation ziehen. Die Top-Level-Navigation ist im Wesentlichen auf die gleiche Weise mit Ausnahme der Funktionen aufgerufen ist CreateMenu () und CreateMenuRecursive ().

Einige der Code verwende ich hier habe ich das Lesen anderer Beiträge auf dieser Seite bekommen, aber ich habe keine Antwort auf diese gefunden. Vielen Dank im Voraus für jede Hilfe.

<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>

Answer 1

Wie sich herausstellt, ich machte es viel zu kompliziert. Alles, was ich tun musste, war die href (news.aspx) aus dem JSON-Menü-String und erhält das Untermenü zu finden. Ich habe, was ich hatte oben und destilliert es um diese wenigen Zeilen Code unten:

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

Es erstellt dynamisch dieses div und ungeordnete Liste sogar den Stil ziehen, das heißt „Menü-top“ aus dem JSON-Menü string:

<div id="LeftNavDiv">
    <ul>
        <li class="menu-top"/>
        <li><a href="sandbox1.aspx">Lorem ipsum</a></li>
        <li class="menu-bot"/>
   </ul>
</div>