[AJAX] Firefox compatibility

[.Alex]

Bonjour,

Ik ben sinds enkele dagen met AJAX bezig en snap al het een en ander. Heb een 'leuk' scriptje gemaakt in een soort van productadministratie. Als ik op een (textuele) link klik, krijg ik in een divje info over het product.

Ik maak hierbij gebruik van de volgende code:

code:

function createXMLHttp()
{
    if(typeof XMLHttpRequest != "undefined")
    {
        return new XMLHttpRequest();
    }
    else if(window.ActiveXObject)
    {
        var aVersions = ["MSXML2.XMLHttp.5.0", "MSXML2.XMLHttp.4.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp", "Microsoft.XMLHttp"];
        for(var i=0; i<aVersions.length; i++)
        {
            try
            {
                var oXmlHttp = new ActiveXObject(aVersions[i]);
                return oXmlHttp;
            }
            catch(oError)
            {
                // do nothing
            }
        }
    }
    throw new Error("MSXML is not installed.");
}

function createXMLDOMObj()
{
    var aVersions = ["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument", "Microsoft.XmlDom"];
    for(var i=0; i<aVersions.length; i++)
    {
        try
        {
            var oXmlDom = new ActiveXObject(aVersions[i]);
            return oXmlDom;
        }
        catch (oError)
        {
            // do nothing
        }
    }
    throw new Error("MSXML is not installed.");

}

function getXMLDoc(aid)
{
    var oXmlHttp = createXMLHttp();
    oXmlHttp.open("get", "xml_artikel.php?seizoen=<? echo($post_seizoen);?>&geslacht=<? echo($post_geslacht);?>&part=<? echo($post_part);?>&time=<? echo(time());?>", true);
    oXmlHttp.onreadystatechange = function()
    {
        if(oXmlHttp.readyState==4)
        {
            if(oXmlHttp.status==200)
            {
                LoadingXML(oXmlHttp.responseText, aid);
            }
        }
    };
    oXmlHttp.send(null);
}

function LoadingXML(rt, aid)
{
    var oXmlDom = createXMLDOMObj();
    oXmlDom.onreadystatechange = function()
    {
        if(oXmlDom.readyState==4)
        {
            if(oXmlDom.parseError.errorCode==0)
            {
                parsingXML(oXmlDom, aid);
            }
        }
    };
    oXmlDom.loadXML(rt);
}

en daarnaast nog een parse-functie (parsingXML()) die de code netjes in de div gooit. Ik verwacht niet dat het in die functie verkeerd gaat, dus deze laat ik even achterwege.

Anyway, het werkt prima in IE! Ben er zelf helemaal happy mee, echter werkt het niet in Firefox. Ik heb al geprobeerd wat statements aan te passen maar krijg het maar niet voor elkaar. Juist omdat ik slechts enkele dagen met AJAX bezig ben, snap ik niet waar de fout zit. Kan iemand van jullie me een eindje op weg helpen?

Alvast bedank!

Groet,
Alex

[crisp]

Je moet even zoeken wat het crossbrowser equivalent is van DomDocument, maar als je pure XML terugstuurd kan je natuurlijk ook gewoon gebruik maken van de responseXML ipv de responseText eerst te parsen

[.Alex]

code:

function createXMLDOMObj()
{

    if(document.implementation && document.implementation.createDocument)
    {
        var oXMLDom = new DOMParser();
        return oXmlDom;
    }
    else
    {
    
        var aVersions = ["MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocument.3.0", "MSXML2.DOMDocument", "Microsoft.XmlDom"];
        for(var i=0; i<aVersions.length; i++)
        {
            try
            {
                var oXmlDom = new ActiveXObject(aVersions[i]);
                return oXmlDom;
            }
            catch (oError)
            {
                // do nothing
            }
        }
    }
    throw new Error("MSXML is not installed.");

}

Je bedoelt iets wat lijkt op dit?

Ik krijg trouwens de volgende foutmelding in Firefox: "oXmlDom has no properties"

[ Voor 8% gewijzigd door .Alex op 03-07-2006 12:56 ]

[crisp]

Ik gebruik dit:

JavaScript:

var oXMLDom = document.implementation.createDocument("", "", null);

maar zoals gezegd: als je met echte XML werkt is het overbodig om het clientside te parsen naar een DOM tree aangezien je dan gewoon met de responseXML kan werken.

[.Alex]

crisp schreef op maandag 03 juli 2006 @ 12:58:
Ik gebruik dit:

JavaScript:

var oXMLDom = document.implementation.createDocument("", "", null);

maar zoals gezegd: als je met echte XML werkt is het overbodig om het clientside te parsen naar een DOM tree aangezien je dan gewoon met de responseXML kan werken.

Die regel code had ik inderdaad ook gevonden, dacht alleen dat 'ie niet goed was... Thanks!

Als ik met responseXML ga werken moet ik waarschijnlijk mn complete code aanpassen, is het niet? Ik ben al blij dat ik dit uiteindelijk in elkaar heb kunnen zetten :-)

edit: Nee, ik ben niet lui. Ik zit alleen tegen een deadline aan te werken die steeds dichter bij komt

edit2:
Parse-functie die ik nu gebruik:

code:

function parsingXML(oXmlDom, aid)
{
    var root = oXmlDom.documentElement;
    var customers = root.getElementsByTagName("artikel");
    for(var i=0; i<customers.length; i++)
    {
        var artikelID = customers[i].getAttribute("id");
        var naam;
        var currentArtikel = customers[i].firstChild;
        do
        {
            switch(currentArtikel.tagName)
            {
                case "naam":
                naam=currentArtikel.text;
                break;

                
                default:
                break;
            }
        }while(currentArtikel = currentArtikel.nextSibling);
        var obj = document.getElementById("dvPanel");
        var html = "<b>Artikel ID: </b>" + artikelID + "<br />Naam:"+naam+"<br />";
        
        if(artikelID == aid)
        {
            obj.innerHTML=html;
        }
    }
}

Wat moet ik doen om zonder DOM te werken, en hetzelfde resultaat te behouden?

edit3:
Heb het volgende voor elkaar gekregen:

code:

function getXMLDoc(aid)
{
    var oXmlHttp = createXMLHttp();
    oXmlHttp.open("get", "xml_artikel.php?seizoen=<? echo($post_seizoen);?>&geslacht=<? echo($post_geslacht);?>&part=<? echo($post_part);?>&time=<? echo(time());?>", true);
    oXmlHttp.onreadystatechange = function()
    {
        if(oXmlHttp.readyState==4)
        {
            if(oXmlHttp.status==200)
            {
                var response = oXmlHttp.responseXML.documentElement;
                naam=response.getElementsByTagName('naam')[aid].firstChild.data;
                document.getElementById("dvPanel").innerHTML=naam;
            
            }
        }
    };
    oXmlHttp.send(null);
}

Werkt prima :-) Ben nu aan het uitzoeken hoe ik het per id kan uitlezen enzo Dit probleem is in ieder geval opgelost tot dusver Thanks!

[ Voor 79% gewijzigd door .Alex op 03-07-2006 14:34 ]