einer der
vielen vorteile bei der verwendung von
prototype ist die recht
einfache verwendung von ajax requests. so braucht man sich überhaupt nicht um kümmern, ob nun eine instanz vom
XHMHttpRequest() (firefox, opera, safari) oder vom
ActiveXObject("Msxml2.XMLHTTP") bzw
ActiveXObject("Microsoft.XMLHTTP") (internet explodierer) erzeugt werden muss.
da sich nun
ajax.request und
ajax.updater recht ähnlich sehen, kann man durch die
"macht der gewohnheit" auch etwas übersehen. ich habe es also geschafft, dass etwas
doppelt geladen wird und wusste zuerst nicht warum, obwohl die
lösung doch ganz einfach ist/war ;)
hier mal die beiden, die das
gleiche ergebnis liefern (farblich gekennzeichnet):
new Ajax.Request('file.html', {
method:'post',
evalScripts:true,
onComplete:function(transport) {
$('container').update(transport.responseText);
}
});
new Ajax.Updater('container','file.html', {
method:'post',
evalScripts:true
});
wie zu sehen ist,
erspart man sich durch den
ajax.updater (= die spezielle form des
ajax.requests) ein
bisschen tipparbeit. vor allem
zu empfehlen ist der
updater, wenn die
zu ladende datei ohne weitere verarbeitung gleich in einen
container geladen werden soll, da dies automatisch geschieht.
aus
gründen der interaktion ist es sinnvoll bei
größeren ladezeiten den benutzer über den
ladezustand zu informieren, dass es nicht den anschein hat, dass sich nichts tut. meist wird hier ein
ladesymbol angezeigt (vgl sanduhr bei windows).
bei einem vorhanden
ajax.request sieht dies möglicherweise so aus (vereinfacht dargestellt):
new Ajax.Request('file.html', {
method:'post',
evalScripts:true,
onCreate:function() {
$('container').update("<img src=\"path/to/loading.gif\" />");
},
onComplete:function(transport) {
$('container').update(transport.responseText);
}
});
hier wird beim
erzeugen des requests (
onCreate) das
ladesymbol in den container geladen und wenn die
datei fertig geladen wurde (
onComplete)
durch den eigentlichen content ersetzt.
da aber bereits ein
ajax.updater vorhanden war und ich einfach nur die
onCreate und
onComplete funktion kopiert habe (
i love copy&paste although sometimes it's evil), kam es zum
doppelten laden:
new Ajax.Updater('container','file.html', {
method:'post',
evalScripts:true,
onCreate:function() {
$('container').update("<img src=\"path/to/loading.gif\" />");
},
onComplete:function(transport) {
$('container').update(transport.responseText);
}
});
glücklicherweise kam ich bei genauerem hinsehen gleich auf die lösung.
mfg mailo
mailo - 7. Feb, 22:00
