[JS & XMLdom] Treemodel uitlezen uit xml en weergeven..

[r0bert]

Ik zit met het volgende probleem.

Ik krijg de structuur van een (navigatie)menu aangeleverd via een xmlstream. Dit moet met behulp van javascript overzichtelijk weergegeven worden. En zo, dat de gebruiker duidelijk de structuur kan zien. Dus wat bij wat hoort e.d.

Nu ben ik aan het scripten gegaan, maar het scriptje wil niet doen, wat ik wél wil

Even wat code..

de xmlstream (template):

code:

<?xml version="1.0"?>

<contents>
    <menu>menu 1
        <item>item 1</item>
        <item>item 2</item>
        <item>item 3</item>
        <item>item 4
            <item>item 4.1</item>
            <item>item 4.2
                <item>item 4.2.1</item>
                <item>item 4.2.2</item>
            </item>
            <item>item 4.3</item>
        </item>
        <item>item 5</item>
    </menu>
    
    <menu>menu 2
        <item>item 1</item>
        <item>item 2</item>
        <item>item 3
            <item>item 3.1</item>
        </item>
        <item>item 4</item>
    </menu>
</contents>

Het bovenstaande is een mogelijke structuur van de xmlstream. Deze kan eventueel nog aangepast worden, als er dingen onlogisch in mekaar zouden blijken te zitten.

Nu het JavaScript gedeelte:

code:

// het XMLdocument wordt ingeladen als XMLdom met als objectnaam 'objXmlDoc'
// (de functie LoadXML staat in een ander extern js document)

LoadXML('../XML/menu.xml');

// dit is de functie die na het laden van het body element, aangeroepen zal worden met : "     fnMenuItems('menu');       "

function fnMenuItems(argNodeRef)
{
    
                // nu moeten alle menu-tags uit de XMLdata worden gevist..
    arrData = eval('objXmlDoc.documentElement.selectNodes(\'' + argNodeRef + '\')');
    
                // voor iedere gevonden menu-tag roepen we de functie fnLoopChilds 
                // aan met het object van de huidige menu-tag

    for (var i = 0; i < arrData.length; i++)
        fnLoopChilds(arrData[i]);
}


function fnLoopChilds(arrWhat)
{
    
    for (var i = 0; i < arrWhat.childNodes.length; i++)
                {
                                // wat info over de huidige loop..

        alert('Huidige waarde van de child: '+ arrWhat.childNodes.item(i).nodeValue);
        alert('i loop: '+ i);

                                // als het huidige child element ook nog childNodes heeft, dan
                                // gaan we die ook nog maar even doorlopen.. dus roepen 
                                //we de functie opnieuw aan..

        if (arrWhat.childNodes.item(i).childNodes.item(0)) fnLoopChilds(arrWhat.childNodes.item(i));
    }
}

het enige wat ie tot nu toe dus hoeft te doen, is wat waardes alerten en alle childs doorlopen.. verder geeft het scriptje nog niets op de pagina weer.. maar dit wat ik hierboven heb staan, werkt voor geen meter..

nog even de code van de LoadXML functie om het xml document in te laden..

code:

function LoadXML(sXML)
{
    objXmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
    objXmlDoc.async = false;
    objXmlDoc.load(sXML);
}

Kan iemand me verder helpen, of misschien aan een bron helpen waarmee ik verder kan komen ?

[crisp]

Toevallig gisteren (toen GoT nog down was) een hoogwaardig topic hierover gevonden op FOK! (jaja, het kan ) --> deze dus.
Ik denk dat je zoiets wilt; vergeet ook mijn replies niet!

[r0bert]

Jaw! Dat is wat ik +- zocht! Vooral dat eerste scriptje heeft me een hoop op weg geholpen. Je trackercode ziet er trouwens ook wel heeeel vetjes uit

[r0bert]

Ik zit nu nog met één ander probleempje, en dat is dat ik aan moet geven wat de parentNode is.

Leek mij dat ik dat op 2 manieren kon doen..

1) meeparsen in de functie
2) aanspreken met parentNode

Maar omdat de xml elementen genest zijn, kan ik op de één of andere manier de tekst van de parentNode niet uitlezen, omdat ie zegt dat het alleen een element is ofzo, zonder content.. Komt bij mij iig allemaal heel vaag over

code:

function parseNode(node)
{
    alert(node.nodeValue);
      for (var i=0; i<node.childNodes.length; i++)  // alle childnodes aflopen
      {
     //   etc....

zo ^ probeer ik het nu, maar dat komt nog niet echt ver, want ik krijg steeds de waarde NULL (element).

het is de bedoeling dat ik bij bijv dit:

code:

|contents|
    |menu|menu 1
        |item|item 1|/item|
        |item|item 2|/item|
 <!--  en de rest //-->

^{Hmpfr.. bij bekijk bericht zie ik dat alle < > worden 'geescaped' hopelijk veranderd dat als ik post}
[edit] Zo te zien wordt alles 'geescaped' (weet niet meer hoe je dat noemt) dus ik heb alle < > even vervangen door | jes

via het scriptje aan kan geven dat 'item' 1 & 'item 2' beiden 'menu 1' als parent hebben..

Hopenlijk is het nog een beetje begrijpelijk..

nog een linkje naar nodeValue http://www.devguru.com/Te...ckref/node_nodeValue.html

edit:

Ik heb het nu opgelost met nodeObj.firstChild.data da werkt tot nu toe prima