# Zelleninhalt zu Textfeld und wieder zurück



## Tejo1986 (10. Dez 2010)

Hallo,

ich habe eine tabelle mit verschiedenen Elementen je Zeile.
Das auslesen der Daten von Oracle geht per SQL, das füllen der Tabelle  dann mit java und HTML.
Das ganze läuft über eine .java Datei die ihren inhalt komplett an den Client übergibt, wo dann im Browser die tabelle erzeugt wird.
Das erzeugen der Felder mit Inhalt erfolgt per Schleife, weswegen auch hinter jedem label/Container ein j steht. Damit es eindeutig ist.


1. Sobald ich auf "bearbeiten" klicke, soll sich das Feld zum textfeld ändern, dass ich etwas eintragen kann.
2. Sobald ich auf fertig klicke soll es sich wieder zum normalen feld ändern, wo man nix tippen kann.


1. habe ich wie folge gelöst und es scheint auch zu gehen:
das Textfeld:

```
output += "<tr><td width=\"150px\"><div id=\"container"+j+"\"><div id=\"label"+j+"\">"+ elements.getReference(k, j)+"</font></div></div></td>";

output += "<td width=\"50px\"><div id=\"image"+j+"\"><img width=\"10\" heigth=\"10\" alt=\"Bearbeiten\" id=\"button"+j+"\" src=\"img/edit.jpg\" onclick=\"changeToTextconfig("+j+")\"></div></td></font></tr>";
```

Die Methoden die dann genutzt werden sind zum ersten die Konvertierung zum textfeld:

```
function changeToTextconfig(j) {
    // Inhalt des Lebes auslesen und Label löschen
    var container = document.getElementById('container'+j);
    var element = document.getElementById('label'+j);
    var inhalt = element.innerText;
    container.removeChild(element);

    // Textfeld hinzufügen mit Inhalt des Labels
    element = document.createElement('div');
    element.setAttribute('id','text');
    element.innerHTML = '<input type="text" name="text" value="' + inhalt + '">';
     container.appendChild(element);

    // Bearbeiten-Button löschen
    var image = document.getElementById('image'+j);
    var button = document.getElementById('button'+j);
    image.removeChild(button);

    // Übernehnmen-Button hinzufügen
    button = document.createElement('div');
    button.setAttribute('id', 'button');
    button.innerHTML = '<img src="img/check.jpg" width=\"10\" heigth=\"10\" alt="Übernehmen" onclick="changeToLabelconfig('+j+')" name="bearbeiten'+j+'">';
    image.appendChild(button);
}
```

Das scheint auch zu gehen. Es erzeugt das Textfeld und ändert den Button um,

Aber beim klicken auf den Button kommt eine Meldung, dass das Objekt null ist.

```
function changeToLabelconfig(j) {
    // Inhalt des Textfeldes auslesen und das Textfeld löschen
    var container = document.getElementById('container');
    var element = document.getElementById('text');
    var inhalt = document.konfiguration.text.value;
    container.removeChild(element);

    // Label mit Inhalt des Textfeldes erstellen
    element = document.createElement('div');
    element.setAttribute('id','label');
    element.innerHTML = inhalt;
    container.appendChild(element);

    // Übernehmen-Button löschen
    var image = document.getElementById('image');
    var button = document.getElementById('button');
    image.removeChild(button);

    // Bearbeiten-Button hinzufügen
    button = document.createElement('div');
    button.setAttribute('id', 'button');
    button.innerHTML = '<img src="img/edit.jpg" width=\"10\" heigth=\"10\" alt="Bearbeiten" onclick="changeToTextconfig(j)">';
    image.appendChild(button);
}
```

Könnt ihr mir helfen und sagen wo (wahrscheinlich) bei der 2. Funktion ein fehler ist. Ich finde irgendwie nix. Auch das anhängen von j wie oben bringt keine Änderung.

Danke


----------



## SlaterB (10. Dez 2010)

ich kann Postings mit HTML-Code nicht moderatorisch bearbeiten, dann hier der allgemeine Hinweis: 
immer daran denken dass es noch mehr als dein Thema auf der Welt gibt,
'Textfeld' könnte auch eine Swing-GUI sein, besser im Titel Web/ HTML erwähnen,

und der größte Teil deines Postings scheint irgendwie JavaScript zu sein, hmm,
wo es um Datenbank geht sehe ich gar nicht


----------



## Tejo1986 (10. Dez 2010)

Alles klar. Da stelle ich dort die frage nochmal.

Also die beiden functions sind in ner js Datei, genau. Diese Funktionen werden von der HTMl aufgerufen. Der1.Teil geht ja, nur der 2.Teil nicht.

Danke trotzdem!


----------

