#1 24. Oktober 2008 Zuletzt von einem Moderator bearbeitet: 14. April 2017 Hallo zusammen, ich suche schon sei einiger Zeit eine Möglichkeit um folgendes zu realisieren. Ich habe wie in folgendem Bild zu sehen ist, eine ganz normale Datenbank ausgabe via PHP und möchte wenn ich den Button "Bleistift" (rechts im Bild) anklicke eine direkt bearbeitung dieser Zeile im Browser haben. Sprich wenn ich diesen jetzt anklicke sollte sich "keine" neue Seite öffnen sondern das Feld sollte sich zu einem "Editierbarem Feld" ändern, siehe Bild Nummer 2, Wichtig: Es sollte keine neue Seite geöffnet werden. Ist es so verständlich genug erklärt? =) PS: Diese Funktion findet man auch auf der "Kwick-Community" Seite. Falls das jemand was sagt. Viele Grüsse, gimli_q + Multi-Zitat Zitieren
#2 24. Oktober 2008 AW: Felder direkt im Browser bearbeiten Hi, "keine neue Seite laden" == AJAX musst Dich da aber schon ein wenig einlesen *g* + Multi-Zitat Zitieren
#3 24. Oktober 2008 AW: Felder direkt im Browser bearbeiten javascript onclick textelement in ein input feld umändern und onblur (wenn ich mich nich irre) wieder in ein textfeld umändern. + Multi-Zitat Zitieren
#4 26. Oktober 2008 AW: Felder direkt im Browser bearbeiten HTML: <html> <head> <script type="text/javascript"> function activate(e, id) { var element = document.getElementById(id); if (element) element.readOnly = e.checked; } </script> </head> <body> Inputfeld aktivieren (ja/nein): <input type="checkbox" onChange="activate(this, 'myField')" /> <br /><br /> <input id="myField" type="text" value="hallo" /> </body> </html> + Multi-Zitat Zitieren
#5 26. Oktober 2008 AW: Felder direkt im Browser bearbeiten Wie pleg schon geschrieben hat. Bei der activate-Funktion hauste halt noch ne border-Anweisung rein, die halt sonst auf none steht (damit man nicht erkennt, dass es eigentlich bereits ein Textfeld ist). Deaktiverst du das Feld wieder, musste nen Ajax-Request starten. Da du anscheinend ned viel Ahnung davon hast, guck dir mal die jQuery API an. Damit kannste das sehr einfach umsetzen jQuery: jQuery + Multi-Zitat Zitieren
#6 26. Oktober 2008 AW: Felder direkt im Browser bearbeiten ich glaub er stellt sich das eher so vor: (wie Telefonzelle schon beschrieben hat) HTML: <html> <head> <title>Span <=> Input</title> <script type="text/javascript"> //<![CDATA[ function editSpan(span) { var input = document.createElement('input'); input.value = span.firstChild.nodeValue; input.size = span.offsetWidth / 5; input.onblur = function() { var value = input.value; input.parentNode.replaceChild(span, input); span.firstChild.nodeValue = value; } span.parentNode.replaceChild(input, span); input.focus(); } //]]> </script> </head> <body> <span ondblclick="editSpan(this);">Mit Doppelklick kannst du diesen Text ändern</span> </body> </html> ansonsten, wie schon gesagt, den geänderten text via ajax an den server senden damit der das auch mitbekommt. + Multi-Zitat Zitieren