AJAX & Menu

[Timo Trallala]

Hallo Gemeinde

ich hab mal wieder ein Problem!

Mein Menu sieht in etwa folgendermaßen aus:

<ul id="menu">
.....
<li class="menuItem">
 <a href="index.php?action=news"  title="News">News</a></li>
....
</ul>

mein js dazu

addLoadEvent(collapseMenu);
addLoadEvent(prepareMenu);

function collapseMenu(node)
    {
    if (!document.getElementById)
        return false;

    if (!document.getElementById("menu"))
        return false;

    if (!node)
        node = document.getElementById("menu");

    if (node.childNodes.length > 0)
        {
        for (var i = 0; i < node.childNodes.length; i++)
            {
            var child = node.childNodes[i];

            if (child.nodeName == "UL")
                {
                child.style.display = "none";
                }

            collapseMenu(child);
            }
        }
    }

function prepareMenu()
    {
    if (!document.getElementById || !document.getElementsByTagName)
        return false;

    if (!document.getElementById("menu"))
        return false;

    var links = document.getElementById("menu").getElementsByTagName("a");

    for (var i = 0; i < links.length; i++)
        {
        links[i].onclick = function()
            {
            toggleMenu(this.parentNode.getElementsByTagName("UL")[0], this.href);

            return false;
            }
        }
    }

function toggleMenu(node, link)
    {
    if (!document.getElementById)
        return false;

    if (!link)
        return false;

    if (!node)
        {
        var file = getQueryString(link);
        var param = getParams(link);
        getContent(param);
        return false;
        }

    // Collapse all nodes, and only show clicked node (when clicking top level of menu)
    if (node.parentNode.parentNode.id == "menu")
        {
        hideTopLevels();
        }

    if (node.style.display == "")
        {
        Effect.BlindUp(node,
            {
            duration: 0.2
            });
        }

    else
        {
        Effect.BlindDown(node,
            {
            duration: 0.2
            });
        }
    }

function hideTopLevels()
    {
    if (!document.getElementById)
        return false;

    if (!(node = document.getElementById("menu")))
        return false;

    if (node.childNodes.length > 0)
        {
        for (var i = 0; i < node.childNodes.length; i++)
            {
            var child = node.childNodes[i];

            for (var j = 0; j < child.childNodes.length; j++)
                {
                var grandchild = child.childNodes[j];

                if (grandchild.nodeName == "UL")
                    {
                    if (grandchild.style.display == '')
                        {
                        Effect.BlindUp(grandchild,
                            {
                            duration: 0.2
                            });
                        }
                    }
                }
            }
        }
    }

function getContent(param)
    {
    //var inc = req;
    var myAjax = new Ajax.Request('inc/content.php',
        {
        method: 'get',
        parameters: param,
        onLoaded: showLoader,
        onComplete: showXHTML
        });
    }

function showXHTML(originalRequest)
    {
    $('col3_content').innerHTML = originalRequest.responseText;
    }

es sollen also nur die contentbereiche erneuert werden.

Das ist auch das Problem: Würde gerne den aktiven Link auszeichnen durch einen anderes Aussehen.

das würde ich im Normalfall via

if($_GET['action']=="news") echo "class=\"active\""; 

erledigen.

Der request geht aber an inc/content.php

Weiss da zufällig jemand einen Rat

MfG
derTrallala

[wahsaga]

Re: AJAX & Menu

Na dann ändere doch die Klasse per Javascript dynamisch ...