Schrift
[thread]2299[/thread]

ChildNodes u. firstChild !?

Leser: 1


<< |< 1 2 3 >| >> 24 Einträge, 3 Seiten
Danwe
 2006-06-20 17:15
#24793 #24793
User since
2006-06-09
76 Artikel
BenutzerIn
[default_avatar]
HI,

mein Problem ist, dass ich im DOM über firstChild oder sonst wie an untergeordnete Elemente kommen möchte, um um diese herum (bzw deren Text) Eingabefelder zu bauen. Nur leider funktioniert firstChild nicht. Liegt das an der Tabelle??

Hier ist der entscheidende Teil der HTML Datei:

Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<form name="Formular" action="gaestebuch.plx" method="post">

<table class="guestTable" width = "400px" onmouseover="colorChangeColor(this)" onmouseout="colorChangeWhite(this)"
onclick="textEditNow(this)">
<tr>
<td id="tests" class="Date" width=125px rowspan=2>
<u><b>#101</b></u>
<p>
19. Juni 2006,<br>um 14:53:37 Uhr<br>
<textarea cols='15' rows='1' name='nachricht'>www.muster.de/test/hallo</textarea>
<p>
</td>
<td class="Name" align = "Right">
<b><input type="text" size="15" maxlength="35" name="titel" value="Mustermann"></b>
aus
<b><input type="text" size="15" maxlength="35" name="titel" value="Musterstadt"></b>
</td>
</tr>
<tr>
<td class='Text'>
<h1><input type="text" size="50" maxlength="35" name="titel" value="Hallo Welt!"></h1>

<textarea cols='90' rows='8' name='nachricht'>Text ... text.</textarea>

</td>
</tr>
</table>

</form>



und hier der js Code, hier würde ich gerne mit childnodes arbeiten.
Also z.B. elem.childNode.childNode.style.backgroundColor = "#cc0000"
Da ich ja 2 Ebenen nach unten gehen muss, um eine der Tabellenspalten zu kriegen! Nur childNodes will nicht!

Achja, in dem Beispiel sind schon die Formularfelder eingebaut wo sie dann mal hin sollen. Ich habe das ganze natürlich auch ohne die Felder, nur mit dem Text, aber so soll es mal aussehen.

Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script type="text/javascript">

function colorChangeColor(elem) {
elem.style.backgroundColor = "#cc0000"; //Farbe Wechseln bei innaktivem Feld (eigentlich möcht ich per childNode die einzelnen Felder in der Farbe ändern, nicht die Tabelle!)
}

function colorChangeWhite(elem) {
elem.style.backgroundColor = "#FFFFFF"; //Farbe Wechseln bei innaktivem Feld (eigentlich möcht ich per childNode die einzelnen Felder in der Farbe ändern, nicht die Tabelle!)
}

function textEditNow(elem) {
// hier wird dann auch mit hilfe von childNodes um die jeweiligen Textteile ein Eingabefeld gebaut.
}

</script>


parentNode geht komischerweise, im gegensatz zu childNodes bzw firstChild.
Per id kann ich übrigens nichts ansprechen, diese eine Tabelle ist nur ein Beispiel, per Perl werden dann noch viel mehr generiert, die man natürlich alle bearbeiten können sollte.\n\n

<!--EDIT|Danwe|1150809498-->
renee
 2006-06-20 20:43
#24794 #24794
User since
2003-08-04
14371 Artikel
ModeratorIn
[Homepage] [default_avatar]
Woher hast Du childNode? Ich habe jetzt nur childNodes gefunden und das ist ein Array mit alles childNodes...

http://de.selfhtml.org/javascript/objekte/node.htm#first_child
OTRS-Erweiterungen (http://feature-addons.de/)
Frankfurt Perlmongers (http://frankfurt.pm/)
--

Unterlagen OTRS-Workshop 2012: http://otrs.perl-services.de/workshop.html
Perl-Entwicklung: http://perl-services.de/
Danwe
 2006-06-21 12:20
#24795 #24795
User since
2006-06-09
76 Artikel
BenutzerIn
[default_avatar]
ok, firstChild ist das richtige.
Allerdings war mein hauptfehler, dass ich nicht beachtet hatte, dass auch der Text der innerhalb eines Elementes eingeklammert ist, als unterelement zählt. Wenn ich also .firstChild.firstChild.firstChild mache geht das nicht, denn ich würde auf das #Text Element zugreifen u. das hat keine Childrens mehr.
ich muss also firstChild.nextSibling.firstChild.nextSiblin usw schreiben. Bei der Tabelle kann das schon recht lang werden, u. wenn ich nochmal was an meiner Tabellenstruktur ändere, wirds unübersichtlich, alles nochmal zu ändern.

Gibts denn keine Alternativen?
ich meine kann ich nicht einfach meine Tabelle ansprechen wie bisher über This, und dann irgendwie alle Zellen mit einer Klasse, bzw einem name="" ansprechen, um schneller u. übersichtlicher darauf zuzugreifen?
nepos
 2006-06-21 12:42
#24796 #24796
User since
2005-08-17
1420 Artikel
BenutzerIn
[Homepage] [default_avatar]
Hm, warum gibst du deinen Eingabefeldern nicht einfach ne ID und greifst dann via
Code: (dl )
document.getElementById(...);
drauf zu?
Dann sparst du dir das Gehangel durch die Tabelle.
Danwe
 2006-06-21 14:10
#24797 #24797
User since
2006-06-09
76 Artikel
BenutzerIn
[default_avatar]
ja aber das geht doch nicht!
Es wird doch ein Gästebuch, das heist ich hätte diese ID nachdem das in perl generiert wurde vielleicht 20 mal in der html datei stehen u. das geht doch nicht!

das Problem ist eben, dass ich diese Tabelle dann öfters habe u. individuell nur die auswählen darf, die der Admin gerade im Fokus (maus) hat. Verstanden?
renee
 2006-06-21 14:31
#24798 #24798
User since
2003-08-04
14371 Artikel
ModeratorIn
[Homepage] [default_avatar]
Du kannst doch auch mit Perl unterschiedliche ID's generieren...
OTRS-Erweiterungen (http://feature-addons.de/)
Frankfurt Perlmongers (http://frankfurt.pm/)
--

Unterlagen OTRS-Workshop 2012: http://otrs.perl-services.de/workshop.html
Perl-Entwicklung: http://perl-services.de/
nepos
 2006-06-21 15:03
#24799 #24799
User since
2005-08-17
1420 Artikel
BenutzerIn
[Homepage] [default_avatar]
Beschreib doch mal genau, was du da machen willst.
Danwe
 2006-06-21 18:20
#24800 #24800
User since
2006-06-09
76 Artikel
BenutzerIn
[default_avatar]
Naja, das mit Perl generieren halte ich für überflüssig, aber daran habe ich auch schon gedacht.

ein Gästebuch möchte ich machen:
Das Gästebuch funzt schon, Leute können posten u. die Nachrichten lesen, gespeichert wird in einem mysql datenbank, es gibt eine ID Spalte die per autoincrement Zahlen gefüllt ist (die könnten für die ID dienen).

Nun möchte ich einen Admin bereich gestalten.
Der Admin kann dann einfach einen Beitrag anklicken, u. sofort verschwinden die texte wie username u. nachricht usw, dafür sieht man dann eingabeboxen mit dem Selben text darin. Dort kann der Admin seine Änderungen vornehmen u. dann wieder den Eintrag speichern. Die ID aus der Tabelle steht dann auch bei jedem Eintrag dabei, damit ich weis welcher Eintrag das ist.

Aber für die eingabefelder möchte ich nun eigentlich keine IDs mehr generieren müssen. Ich habs jetzt auch schon geschafft alle Texte zu löschen u. deren inhalte in neue Variablen zu speichern. Jetzt muss ich nurnoch die Eingabefelder generieren u. die texte der Variablen wieder hineinschreiben, ich denke das bekomme ich hin :D

ich habe nun einfach alle Tags um die texte mit name="editable" versehen, auf diese greife ich dann zu, u. operiere von dort aus.

EDIT:
ein was habe ich aber dabei übersehen:
Ich suche jetzt irgendwie ALLE namen ab u. neheme alls Felder die als name="editable" haben. und das werden ja dann alle meine entsprechenden Felder in allen Tabellen (also alle Gästebucheinträge) haben.
Ich werde so also immer nur den ersten eintrag veränder könne weil ich z.b. nach
var mailValue = document.getElementsByName("editable")[0].firstChild.nodeValue;
frage.
Welche möglichkeit gibt es, zwar nach getElmentsByName zu suchen, aber dies AB einem bestimmten knoten, den ich über This definiere?
Also so dass ich nach getElementsByName suche, allerdings werden nur die gefunden die UNTER meiner aktuellen Gästebuch(tabelle) hängen!\n\n

<!--EDIT|Danwe|1150900992-->
GwenDragon
 2006-06-21 18:48
#24801 #24801
User since
2005-01-17
14748 Artikel
Admin1
[Homepage]
user image
Also nach HTML-Standard sollte jedes Element einen eindeutigen Namen haben, also nicht alle name=editable sondern name=editable1 ... name=editable2 etc.
Strat
 2006-06-21 20:52
#24802 #24802
User since
2003-08-04
5246 Artikel
ModeratorIn
[Homepage] [default_avatar]
sowas koennte man mit AJAX ganz gut machen.

Eine seite mit:
[html]
<div id="msg1">...</div>
bis
<div id="msg20">...</div>
[/html]
anlegen, dann kannst du auf einer seite 20 Nachrichten posten (musst halt vor- und zurueckblaettern implementieren, aber das ist nicht so schwierig.

wenn du z.B. prototype.js als Bibliothek dafuer verwendest, kannst du einfach mit
Code: (dl )
$('msg0').innerHTML = message1; # ist abkuerzung fuer getElementById

den nachrichtencontent reinschreiben.
perl -le "s::*erlco'unaty.'.dk':e,y;*kn:ai;penmic;;print"
http://www.fabiani.net/
<< |< 1 2 3 >| >> 24 Einträge, 3 Seiten



View all threads created 2006-06-20 17:15.