nicht angemeldet
Ajax & getelementbyId - Problem
StruppiHi,
habe ein Problem mit einem HTML- Element das
per Ajax in ein DIV geladen wird und kann die
Eigenschaften dieses Elements irgendwie nicht ausgeben!
Beispiel:
document.getElementById('data_preview_ajax').innerHTML=xmlhttp.responseText;
in dieses DIV element werden folgende daten geladen
von einer separaten Datei < und korrekt dargestellt:
<div style="width:20px; height:95px; float:left; padding:5px 0 0 7px; margin:0 10px 0 0px; background-color:#c5d5fc"><b>01</b></div> <a href="#" onclick="JavaScript:func_img_prev(1)"><img id="img_prev_1" src="123.jpg" height="100" border="0" name="1"></a><p>
auf der eigentlichen Seite möchte ich dann die Eigenschaften des Elements:
img_prev_1 auslesen:
alert(document.getElementById('img_prev_1').src);
bekomme jedoch immer Fehlermeldung:
document.getElementById('img_prev_1') is null
was mache ich falsch?
Gruß
Siggi
-
Beispiel:
document.getElementById('data_preview_ajax').innerHTML=xmlhttp.responseText;in dieses DIV element werden folgende daten geladen
von einer separaten Datei < und korrekt dargestellt:
Oder etwas genauer, die innerHTML Eigenschaft bekommt den Wert, der in responseText steht.
<div style="width:20px; height:95px; float:left; padding:5px 0 0 7px; margin:0 10px 0 0px; background-color:#c5d5fc"><b>01</b></div> <a href="#" onclick="JavaScript:func_img_prev(1)"><img id="img_prev_1" src="123.jpg" height="100" border="0" name="1"></a><p>
Wozu ist hier der Link href="#" nötig, muss man mit diesen Link an den Anfang der seite springen können? Wozu soll das Label im onclick Eventhandler dienen? Wo hast du das her? Warum nimmst du nicht den onclick Handler des Bildes? Das würde neben der Code ersparnis auch den Code vereinfachen, da du dann dirtekt mittels this die Referenz auf das Bild übergeben könntest.
alert(document.getElementById('img_prev_1').src);
bekomme jedoch immer Fehlermeldung:
document.getElementById('img_prev_1') is null
was mache ich falsch?
Keine Ahnung, bei dem Code den du uns gezeigt hast, tritt diese Fehlermeldung nicht auf.
Struppi.
-
die code vereinfachung ist genehmgigt ;-)
das ist aber nicht das Problem, denn im Firefox 3.5.7 erhalte ich:
document.getElementById('img_prev_1') is null
die inhalte von: xmlhttp.responseText
werden jedoch korrekt in 'data_preview_ajax' dargestellt!ich verstehe es leider auch nicht!
woran könnte es dennoch liegen?-
Hi dude!
woran könnte es dennoch liegen?
Reine Spekulation: Du fragst nach einem Element, was noch nicht existiert.
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)-
das habe ich auch schon gedacht, jedoch wird dieses und andere
elemente werden wie schon gesagt korrekte dargestellt in:<div id="data_preview_ajax"></div>
später rufe ich dann z.B. in einer funktion:
alert(document.getElementById("img_prev_1"));
auf!
habe auch schon diverses getestet, aber es wird mir gesagt
das das element nicht existiert!-
ich habe das Gefühl das die dargestellten & benötigten Elemente innerhalb von:
data_preview_ajax
von außerhalb nicht erkannt werden!
kann dies evtl. auch mit einer verschachtelung zusammenhängen?wenn man die elemente anklickt wird die funktion innerhalb von
onclick korrekt ausgeführt!kann man denn die elemente denn auch direkt aus ajax funktionalität
auslesen, per:xmlhttp.XMLresponse oder so ähnlich?
-
ich habe das Gefühl das die dargestellten & benötigten Elemente innerhalb von:
data_preview_ajax
von außerhalb nicht erkannt werden!
kann dies evtl. auch mit einer verschachtelung zusammenhängen?Nein.
Aber ich habe dir in meinem ersten Posting schon einen Tipp gegeben. wenn du den onclick Handler auf dem Bild verwendest, kannst du this übergeben und brauchst keine ID mehr.
Struppi.
-
ich benötige aber die ID weil ich aus der Datenbank eine ID lade, um dann das entsprechende element in > img_preview_src < einzubinden
bzw. darzustellen !!!vielleicht können auch noch andere fehlerquellen genannt werden!
in Datei 1 (siehe Posting) passiert übrigends noch folgendes:
<html>
<head>
<script>
function js_onload() {
display_data(1,'preview','gal_1');
}
</script>
</head>
<body onload="javascript:js_onload();">--- Inhalt ---
</body>
</html>-
ich benötige aber die ID weil ich aus der Datenbank eine ID lade, um dann das entsprechende element in > img_preview_src < einzubinden
bzw. darzustellen !!!Das hatte ich sogar in meinem Code eingebaut.
vielleicht können auch noch andere fehlerquellen genannt werden!
Benutzt du die ID mehrfach?
<body onload="javascript:js_onload();">
wie kommst du auf dei Idee, dass ein JS Handler ein Sprunglabel 'javascript:' braucht? Du verwechselst es mit dem Pseudoprotokoll in einem Link, hier ist es unnötig.
Struppi.
-
danke für die js-tipps ;-)
bin eher php programmierer :-oids werden nicht doppelt vergeben.
nun bin ich trotzdem etwas ratlos und
habe keine ahnung was ich noch machen kann !!!!-
Hi dude!
nun bin ich trotzdem etwas ratlos und
habe keine ahnung was ich noch machen kann !!!!Eine Beispielseite würde Struppi sicher zu konkreter Hilfe verleiten! =)
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)-
so dann schaut mal und versucht euer glück:
http://test.dbf.de1.cc/ajax1.html
bitte keine angaben zu inhaltlichen fehlern etc. bzw. sekundär,
mir geht es vorrangig um das genannte problem!-
so dann schaut mal und versucht euer glück:
http://test.dbf.de1.cc/ajax1.html
Es tritt genau das ein, was Hopsel hier schon sagte. Du rufst die Funktion auif, bevor da überhaupt ein Inhalt ist.
Struppi.
-
das mag sein, aber
wie vielleicht sehen kannst ruf ich die funktion auch nochmal
am ende der datei auf und es funktioniert trotzdem nicht!nenn mir doch bitte kurz & bündig die korrekte ablauffolge !
-
das mag sein, aber
Irhendwie hast du ein Talent entweder an anderen vorbei zu reden oder du verstehst es nicht.
wie vielleicht sehen kannst ruf ich die funktion auch nochmal
am ende der datei auf und es funktioniert trotzdem nicht!Das ist der grund dafür dass es nicht funktioniert.
nenn mir doch bitte kurz & bündig die korrekte ablauffolge !
Request -> Response -> Verarbeitung -> Zugriff
Struppi.
-
vielleicht von beiden etwas :-/
sorry dann bin ich wohl zu blöd:1.) ich rufe die funktion im <head> auf
es funktioniert nicht
2.) ich rufe die funktion am ende der datei auf
es funktioniert nicht
wo soll ich sie bitte dann aufrufen?
Request -> Response -> Verarbeitung -> Zugriff
damit kann ich leider nicht soviel anfangen
erklär es mir doch bitte anhand der reihenfolge beim
aufruf/ablauf der vorgänge/funktionen meiner datei!-
1.) ich rufe die funktion im <head> auf
es funktioniert nicht
2.) ich rufe die funktion am ende der datei auf
es funktioniert nicht
wo soll ich sie bitte dann aufrufen?
Dann wenn das Element da ist, da du es mit AJAX holt, also erst nachdem der AJAX Request verarbeitet wurde.
Request -> Response -> Verarbeitung -> Zugriff
damit kann ich leider nicht soviel anfangenDann verstehe ich nicht, warum du mit AJAX arbeitest, wenn du das Grundprinzip nicht verstanden hast.
erklär es mir doch bitte anhand der reihenfolge beim
aufruf/ablauf der vorgänge/funktionen meiner datei!Datei lädt -> JS Aufruf -> Fehlermeldung
Struppi.
-
@struppi
ich weiß warum ich mit ajax arbeite:
da es verschiedene möglichkeiten der besseren usabilty bietet
das heißt aber noch lange nicht das man auf anhieb verstehen
muß wie es genau funktioniert, sonst würde ich mich auch nicht
an das forum wenden!leider kann ich mit deinen letzten erklärungen nicht viel
anfangen sie sind einfach zu allgemein.du sagst bei dir funktioniert es, dann sag mir doch bitte genau
wo nun bei mir der fehler liegt und lass mich nicht rumrätseln!ich verstehe einfach nicht warum ein objekt zwar angezeigt wird
aber nicht in einer funktion verfügbar ist!wenn die antworten bitte quellcode bezogen wären, ist mir
das deutlich lieber und würde mir wäre das ganze auch
vesrtändlicher machen für mich machen!-
ich weiß warum ich mit ajax arbeite:
da es verschiedene möglichkeiten der besseren usabilty bietet
das heißt aber noch lange nicht das man auf anhieb verstehen
muß wie es genau funktioniert,Nein, aber das grundprinzip solltest du schon verstanden haben, wenn du es einsetzt.
leider kann ich mit deinen letzten erklärungen nicht viel
anfangen sie sind einfach zu allgemein.Das verstehe ich nicht, sie sind speziell auf deine Frage bezogen.
du sagst bei dir funktioniert es, dann sag mir doch bitte genau
wo nun bei mir der fehler liegt und lass mich nicht rumrätseln!Das habe ich und Hopsel dir schon mehrmals hier gesagt.
ich verstehe einfach nicht warum ein objekt zwar angezeigt wird
aber nicht in einer funktion verfügbar ist!Wo wird es angezeigt?
Struppi.
-
ich habe doch bereits schon am anfang gesagt das die betroffenen objekte/bilder z.B. 'img_prev_1' etc. korrekt
in 'data_preview_ajax' dargestellt werden!
wenn ich auf diese klicke erscheinen diese auch in: 'img_preview_src'
nur wenn ich die funktion: func_img_prev(val) beim laden der seite
verwende ist document.getelementbyid('img_rev_1') = nullFakt & Fazit:
- ich kann den Quellcode der genannten Beispieldatei z.Zt. nicht bereinigen
- bitte nennt mir den Fehler der Platzierung von Funktionen oder Objekten sofern dies der Fall ist & wo und wie man diesen beheben kann!!!
-
ich habe doch bereits schon am anfang gesagt das die betroffenen objekte/bilder z.B. 'img_prev_1' etc. korrekt
in 'data_preview_ajax' dargestellt werden!
Nicht in deinem Beispielcode.
nur wenn ich die funktion: func_img_prev(val) beim laden der seite
verwende ist document.getelementbyid('img_rev_1') = nullLogisch, weil dann das Element nicht existiert. Was soll das rumreiten auf immer den gleichen Aussagen?
Struppi.
-
-
Hi dude!
ich verstehe einfach nicht warum ein objekt zwar angezeigt wird
aber nicht in einer funktion verfügbar ist!Struppi hat´s zwar schon geschrieben, trotzdem nochmal: Die URL, die du auf der Beispielseite verwendest, ist falsch.
Das Div wird nicht mit Inhalt gefüllt.
Dazu kommt noch ein unterirdisch schlechter HTML-Code, der gespickt mit Fehlern ist.
Sobald du ein Beispiel hast, das minimal und - soweit dir möglich - von allen Fehlern befreit ist, kann dir geholfen werden.Aber eine Beispielseite zu zeigen und dann vorzugeben, dass da etwas funktionieren soll, obwohl das überhaupt nicht der Fall ist, ist _extrem_ kontraproduktiv.
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:) -
Hi,
ich weiß warum ich mit ajax arbeite:
da es verschiedene möglichkeiten der besseren usabilty bietet
Es bietet vor allem zahlreiche Möglichkeiten zur *Verschlechterung* der Usability, wenn es von jemandem eingesetzt wird, dem noch Grundkenntnisse über die Technik an sich fehlen.
MfG ChrisB
--
“Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
-
-
-
-
-
-
-
@struppi:
ich habe deinen hinweis befolgt jedoch erhalte
ich nun bei alert: undefinedund wie gesagt ich nutze den firefox !
aber vielleicht kannst du mir noch etwas zu: XMLHttpRequest
erzählen!-
ich habe deinen hinweis befolgt jedoch erhalte
ich nun bei alert: undefinedDann machst du etwas falsch.
und wie gesagt ich nutze den firefox !
das ist eune gute Wahl
aber vielleicht kannst du mir noch etwas zu: XMLHttpRequest
erzählen!Du erwartest doch nicht, dass ich so eine Anfrage ernst nehme? Es gibt über AJAX Bücher und du erwartest, dass ich mal so nebenbei locker in einem Forum dir "irgendwas zu" erzähle????
Struppi.
-
-
Hi,
so dann schaut mal und versucht euer glück:
http://test.dbf.de1.cc/ajax1.html
Mit was?
Beschreibe bitte, *wie* dieses Dokument zu bedienen ist, um den Fehler zu reproduzieren.
Ich habe keine Lust, irgendwo herumzuklicken und darauf zu warten, dass er irgendwann mal Auftritt.Und dass schon vor dem ersten getElementById-Fehler eine handvoll weitere Fehlermeldungen in der JS-Console auftauchen, sollte dir auch zu denken geben. Vielleicht beseitigst du deren Ursachen erst mal.
MfG ChrisB
--
“Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
-
-
-
ids werden nicht doppelt vergeben.
Dann macht deine Fehlermledung keinen Sinn, zumindest nicht mit dem Code, den du uns gezeigt hast, aber das sagte ich bereits. Es wäre einfacher, wenn du ein Beispiel zeigen könntest, das den Fehelr erzeugt, von dem du sprichst.
nun bin ich trotzdem etwas ratlos und
habe keine ahnung was ich noch machen kann !!!!Ich habe dir doch schon einen funktionierenden Beispielcode gezeigt, wie wäre es, wenn du denn einfach benutzt?
Struppi.
-
-
-
-
-
ok hier nun der CODE:
1.) view.php
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
<div>
<script type="text/javascript">function display_data(id,type,gal) {
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null) {
alert ("Your browser does not support AJAX!");
return;
}var url= "http://domain/data.php";
url=url+"?type="+type+"&id="+id+"&gal="+gal;xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 || xmlhttp.readyState=="complete") {
document.getElementById('data_preview_ajax').innerHTML = xmlhttp.responseText;
}
}xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}function GetXmlHttpObject() {
var xmlhttp=null;
try {
// Firefox, Opera 8.0+, Safari
xmlhttp=new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}return xmlhttp;
}function func\_img\_prev(val) {document.getElementById('img_preview_src').src=document.getElementById('img_prev_' + val).src;
document.getElementById('data_preview').innerHTML='<input type="hidden" name="pic_preview" value="' + val+ '">';alert(document.getElementById("img_prev_" + val).src);
}; func\_img\_prev(1);</script>
<div id="data_preview_ajax" style="height:110px; width:260px; overflow: auto; float: left"></div>
<div id="img_preview" style="margin-left:280px; height:100px; width:150px;"><img id="img_preview_src" src="../img/leistungen_no_prev_small.jpg" height="100"></div>
div id="data_preview"></div>
</div>++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
2.) data.php
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
<div style="width:20px; height:95px; float:left; padding:5px 0 0 7px; margin:0 10px 0 0px; background-color:#c5d5fc"><b>01</b></div> <img id="img_prev_1" src="../images/galerie/gal_1/dat_46deefcb3ba260ea267ed404e0ec4d22.jpg" height="100" border="0" name="1" onclick="JavaScript:func_img_prev(1)"><p>-
Wenn dein Code keinen syntaxfehler (Fehlerkosnole) enthält, funktioniert er problemlos (ausser ein kleineres Problemen im IE: da du nicht abwartest ob der Request schon fertig ist, führt ein überschreiben des HTTPRequest Objektes zu einer Fehlermeldung).
Aber ich frage mich warum du meinen Hinweis nicht umsetzt?
onclick="func_img_prev(this)"
function func_img_prev(obj) { document.getElementById('img_preview_src').src= obj.src; document.getElementById('data_preview').innerHTML='<input type="hidden" name="pic_preview" value="' + obj.id + '">'; alert(obj.src); };Struppi.
-
-
-
-
-
die code vereinfachung ist genehmgigt ;-)
Dann brauchst du getElementById auch nicht mehr.
das ist aber nicht das Problem, denn im Firefox 3.5.7 erhalte ich:
document.getElementById('img_prev_1') is null
wie schon einmal gesagt, nicht mit dem Code, den du uns gezeigt hast, dort wird das Element problemlos gefunden.
ich verstehe es leider auch nicht!
woran könnte es dennoch liegen?Das Wissen wir nicht, weil du uns nicht den code zeigst, der zu der Fehlermeldung führt.
Struppi.
-
-