Laden in div werkt niet op server

[ikke0101]

In Dreamweaver gaat het goed, zowel in IE als Firefox, maar op server werkt het niet : Ik laad 2 text-bestanden in een init in een div. Op de server laad onder IE alleen het eerste bestand, onder Firefox alleen het tweede, en in Dreamweaver gaat het beide goed ??
// request variable
var request_var;
var LBcontainer;

// Request object method wrapper function
function request_object()
{
try
{
return new ActiveXObject('Msxml2.XMLHTTP');
}
catch(e)
{
try
{
return new ActiveXObject('Microsoft.XMLHTTP');
}
catch(e)
{
return new XMLHttpRequest();
}
}
}

// Call the request object method wrapper function
request_var=request_object();

if(!request_var)
{
alert("Your Web browser does not support the XMLHttpRequest object.");
}

function load()
{
if(request_var.readyState==4)
{
document.getElementById(LBcontainer).innerHTML=req uest_var.responseText;
alert(request_var.responseText);
alert(LBcontainer);
}
return false }

function LaadBestand(bestand,hcontainer)
{
if(request_var)
{
d=document;
request_var.open("GET",bestand,true);
LBcontainer=hcontainer;
request_var.onreadystatechange=load;
request_var.send(null);
}
return false }

function initScrollLayer() {
blok = new getObj("balk");
blok.ypos = parseInt(blok.style.top);
LaadBestand('Tra1UK.txt','lyr1');
LaadBestand('Tra2UK.txt','lyr2');
}

[BernardV]

Denk dat het probleem ligt in de tijd.
Lokaal gaat het waarschijnlijk zo snel dat alles op zijn plek komt.
Maar online gaan de aanvragen naar de server trager.
Dus als je 2x LaadBestand aanroept zal het script de laatste aanvraag uitvoeren (FF) omdat de eerste nog niet klaar is.
Je zou dit kunnen opvangen met array's (denk ik) anders zul je een functie moeten toevoegen die bekijkt of een aanvraag is afgerond en dan pas de volgende uitvoeren.

[ikke0101]

goed idee, enig idee hoe je zoiets doet??

[ikke0101]

Niemand, dit moet toch vaak worden gebruikt, kan ook niets vinden op andere sites ???

[TheDutch]

Dat komt ervan wanneer je code gebruikt die je volgensmij niet (volledig) begrijpt ;).

Je laadt twee bestanden tegerlijk in en gebruikt voor alle twee dezelfde load handler. Dit betekend dat maar één van de twee uiteindelijk in de bepaalde DIV terecht komt.

Ik neem aan dat de twee teksten in twee verschillende DIVs moeten komen. Mijn advies is dus om voor beide teksten een aparte load handler te schrijven en die mee te geven als argument aan LaadBestand(). Op die manier kunnen beide bestanden asynchroon inladen maar overschrijven ze elkaar niet in de load handler :).

[ikke0101]

Mijn bedoeling is om te leren....

Ik heb mbv alert kunnen volgen wat er gebeurt, en op die manier lukt het op IE nu wel, dus als ik een tweede loader inbouw, zal het hier wel lukken.
Het probleem met Firefox is blijkbaar anders, want die laadt helemaal niets in.
Blijkbaar is deze code op die manier niet geschikt voor firefox, maar ik kan niet vinden waarom niet ????

[ikke0101]

Code is geworden
// request variable
var request_var;
// Request object method wrapper function
function request_object()
{
try
{
return new ActiveXObject('Msxml2.XMLHTTP');
}
catch(e)
{
try
{
return new ActiveXObject('Microsoft.XMLHTTP');
}
catch(e)
{
return new XMLHttpRequest();
}
}
}

// Call the request object method wrapper function
request_var=request_object();

if(!request_var)
{
alert("Your Web browser does not support the XMLHttpRequest object.");
}

function LaadBestand(bestand,hcontainer){
if(request_var){
request_var.open("GET",bestand,true);
request_var.onreadystatechange=function(){
if (request_var.readyState==4){
document.getElementById(hcontainer).innerHTML=requ est_var.responseText;
}
}
request_var.send(null)
}
}


Dit is het geworden, werkt nu wel als ik er maar 1 laadt, de volgende wordt pas geladen, na gebruikersinteractie en gaat ook goed....

[TheDutch]

Mijn bedoeling is om te leren....
De stap naar Ajax is groot wanneer je kennis omtrend JavaScript beperkt is. Dat is het enig wat ik er mee bedoelde. Leren is goed, maar dan wel in de juist stappen :).

Buiten de stappen in het leerproces vind ik het erg goed dat je er zo mee bezig bent en het allemaal wilt leren!

[ikke0101]

Ik zou toch nog graag willen weten, voor een andere toepassing, hoe ik kan controleren, wanneer het bestand echt geladen is. Mbv een listner of zo, graag met een voorbeeldje, als iemand hierop het antwoord weet......

[BernardV]

Je zou een queue (array) kunnen aanmaken met alle aanvragen.
In de LaadBestand functie dan als de state 4 is bv een "getNextFile()" functie aanroepen die weer het hele traject doorloopt maar dan met het volgende item uit de array.

Heb even een voorbeeldje gemaakt:

<html>
<head>
<script>
var queue = new Array();

queue.push({url:"test1.html", div:"contentDiv1"});
queue.push({url:"test2.html", div:"contentDiv2"});

function loadContent(loadObject)
{
var xmlRequest = null;
if(window.XMLHttpRequest)
xmlRequest = new XMLHttpRequest();
else if (window.ActiveXObject)
xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");

xmlRequest.onreadystatechange = function()
{
if(xmlRequest.readyState == 4)
{
if(xmlRequest.status == 200)
document.getElementById(loadObject.div).innerHTML = xmlRequest.responseText;

//laden is klaar, dus we laden de volgende
loadFiles();
}
}

try{
xmlRequest.open("GET", loadObject.url, true);
xmlRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlRequest.send(null);
} catch (e) {
alert(e.toString());
}
}

function loadFiles(){
if(queue.length>0){
loadContent(queue.pop());
}
}

</script>
</head>

<body onload="loadFiles()">
<div id="contentDiv1" style="position:absolute;width:400px;height:450px;top:40p x;border:1px solid #000000;overflow:auto;"></div>
<div id="contentDiv2" style="position:absolute;width:400px;height:450px;top:40p x;left:420px;border:1px solid #000000;overflow:auto;"></div>
</body>
</html>

de queue bevat objecten, die kun je aanmaken door var object = new Object(); te gebruiken of door de waardes die je wilt hebben tussen {} te zetten.
Zoals hier staat {url: "test1.html",div:"contentDiv1"} zou betekenen dat het object 2 variabelen heeft die je kunt aanroepen met .variabelenaam, in dit geval dus object.url en object.div. Zo hoef je slechts 1 object mee te sturen voor beide gegevens.

In de onreadystatechange staat nu extra de functie loadFiles() deze roept dus weer het laden van de bestanden aan zodra de vorige is afgerond.
Ik heb nog even de status toegevoegd, omdat een niet gevonden bestand wel een state 4 geeft, maar een status 404. Een goed geladen bestand geeft een status 200.

de pop() functie op een array pakt het bovenste item uit de array en verwijderd deze dan uit de array. Dus je kunt pop() blijven gebruiken, want op een gegeven moment is de lengte van de array 0 en stopt het systeem dus met laden.

Hoop dat dit een beetje duidelijk is.

[ikke0101]

Heel mooi gedaan, dank je wel, maar is er echt geen makkelijkere manier om een div te laden met een txt-betsnad, ik denk aan een include of zoiets.

Moet je dit ook gebruiken om XML te laden ???

[stensol]

vanwege het v/h spoor raken, een nieuw topic geopend:

http://www.flashfocus.nl/forum/showthread.php?p=237899#post237899

[Kangoeroe]

Ik heb een soortgelijk probleem, alleen is het nog iets subtieler denk ik. Wanneer ik volgende HTML/js code laad vanop m'n harde schijf (dus wanneer ik op de file klik in m'n filebrowser) werkt het prima. Wanneer ik echter deze file kopieer naar m'n apache webserver dir en dan probeer lokaal te surfen naar die file gebeurt er niks.

<script type="text/javascript">

var xmlhttp=false;
/*@cc_on @*/
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
try {
xmlhttp = new
XMLHttpRequest();
} catch (e) {
xmlhttp=false;
}
}
if (!xmlhttp && window.createRequest) {
try{
xmlhttp = window.createRequest();
}
catch (e) {
xmlhttp=false;
}
}

function load(){
var pageContent = xmlhttp.responseText;
alert(pageContent);
pageContent = pageContent.replace(/<html>/, "<html onmouseover='whichElement(event)' onmouseout='whichElement2(even)'>");
document.getElementById('content').innerHTML = pageContent;
}

xmlhttp.open("GET", "http://www.ebay.com", true);
xmlhttp.onreadystatechange=load;
xmlhttp.send(null);


function whichElement(e){
var targ
if (!e) var e = window.event
if (e.target)
targ = e.target
else if (e.srcElement) targ = e.srcElement
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode
var tname
tname=targ.tagName
//selectDisplay = document.getElementById("selection")
//selectDisplay.innerHTML = targ.innerHTML
targ.style.border = "thin dotted #OOOOFF"
}

</script>
<html>
<div id="content"></div>
</html>



Lijkt me compleet bizar :/.

[BernardV]

Je kunt ebay niet laden vanaf een domein :) Security ;) Probeer eens een pagina die wel op dezelfde server staat.

[Kangoeroe]

Je kunt ebay niet laden vanaf een domein :) Security ;) Probeer eens een pagina die wel op dezelfde server staat.

Hmm ja, ondertussen al opgemerkt, compleet idioot wel sinds ik die html evengoed kan laten ophalen door een Java applicatie en die dan ophalen met een AJAX call naar m'n webpagina. Zelfde effect, gewoon omslachtiger.

P.S. Sorry voor thread the hijacken.