Intentando acceder al menú JSON en otra función para construir una navegación del lado izquierdo

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

Pregunta

Soy relativamente nuevo en Jquery y JSON y esta es mi primera publicación aquí, tengan paciencia conmigo.

Tengo una cadena de menú JSON con una matriz de tres elementos (nombre, url, id - nuestro número interno de id de página) y la navegación de nivel superior se desarrolla bien. Recorro los elementos de nivel superior y llamo a una función recursiva para obtener los submenús.

Lo que estoy tratando de hacer ahora es en una parte separada de la página web, use la cadena de menú JSON para encontrar una página de nivel superior (news.aspx, por ejemplo) y cree un menú para esa página y su submenú elementos para mostrar en una navegación del lado izquierdo que solo se mostrarán en las páginas de noticias.

El problema que tengo es que este script a continuación funciona sin ningún error de Javascript, sin embargo, está tirando de la navegación de nivel superior. La navegación de nivel superior se llama esencialmente de la misma manera, excepto que las funciones son CreateMenu () y CreateMenuRecursive ().

Parte del código que estoy usando aquí lo he obtenido al leer otras publicaciones en este sitio, pero no he encontrado una respuesta a esto. Gracias de antemano por cualquier ayuda.

<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>
¿Fue útil?

Solución

Como resultado, lo estaba haciendo demasiado complicado. Todo lo que tenía que hacer era encontrar el href (news.aspx) de la cadena del menú JSON y obtener el submenú. Tomé lo que tenía arriba y lo reduje a estas pocas líneas de código:

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

Crea dinámicamente este div y una lista desordenada que tira incluso del estilo, es decir, '' menu-top '' desde la cadena de menú JSON:

<div id="LeftNavDiv">
    <ul>
        <li class="menu-top"/>
        <li><a href="sandbox1.aspx">Lorem ipsum</a></li>
        <li class="menu-bot"/>
   </ul>
</div>
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top