PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
PHP, Javascript, jQuery, Ajax, nodeJS, MySQL...
Javascript um text zu editieren
Beitrag
<blockquote data-quote="daimonion" data-source="post: 846765" data-attributes="member: 188756"><p>Hallo Leute</p><p></p><p>Nachdem ich mit HTML und PHP gut klar komme will ich mich nun ein wenig an Javascript versuchen um meine Fähigkeiten dahingehend zu erweitern. Dazu hab ich mir eine Beispielanwendung rausgesucht, die ich programmieren will.</p><p></p><p>Folgendes Szenario:</p><p>Ich hab einen Container (div-Tag) in dem ein Text (z.B. ein Bildtitel) steht.</p><p>Durch Klick auf den Text soll dieser verschwinden und in einem input-Tag erscheinen. (Der Input-Tag soll quasi mit dem Text an der Stelle des Textes erscheinen. Damit kann der Benutzer den Text verändern. Ein Speichernbutton initialisiert nach der Änderung wieder Speichervorgang, der den geänderten Text mittels Ajax an den Server schickt und ihn dort in der DB speichert. (wobei der Serverteil jetzt für mich nicht schwierig wär).</p><p>Nachdem die Speicherung abgeschlossen ist, soll der Input-Tag verschwinden und der geänderte Text wieder erscheinen.</p><p></p><p>Gesehen hab ich das in einem Orion-Forum, wo das bereits Funktioniert. </p><p></p><p>In diesem Forum sieht der HTML-Teil wie folgt aus:</p><p>[HTML]</p><p><span class="topictitle"></p><p> <span id="topicnewest_696"></p><p> <img src="images/icon_clip.gif" alt="" border="0" /></p><p> </span></p><p> <a href="viewtopic.php?t=696" id="topiclink_13400" class="topictitle">Einladung zur 53. FAR-Sitzung</a></p><p> <span id="title_13400" style="display:none;"></p><p> <input type="text" class="post" name="topictitle_13400" id="topictitle_13400" value="Einladung zur 53. FAR-Sitzung" size="40" maxlength="60" onkeyup="AJAXTitleEditKeyUp(event, 13400)" /></p><p> <input type="hidden" id="orig_topictitle_13400" value="Einladung zur 53. FAR-Sitzung" />&nbsp;</p><p> <input type="button" onclick="AJAXEndTitleEdit(13400)" value="Speichern" class="mainoption" />&nbsp;</p><p> <input type="button" onclick="AJAXCancelTitleEdit(13400)" value="Abbrechen" class="liteoption" /></p><p></span></p><p>[/HTML]</p><p></p><p>Auf die dort verwendeten Javascriptfunktionen hab ich zwar Zugriff, aber da ich aber nicht nur blind abschreiben will, würde ich mich freuen, wenn ihr mir Ansätze geben könntet, wie so eine Funktion implementiert wird. Auch Buchvorschläge sind erwünscht.</p><p></p><p></p><p>Danke für die Hilfe.</p><p></p><p>PS.: Anbei hab ich nochmal ein Bild gestellt, wie das in dem Forum aussieht:</p><p></p><p></p><p></p><p>Gruß</p><p>Daimonion</p></blockquote><p></p>
[QUOTE="daimonion, post: 846765, member: 188756"] Hallo Leute Nachdem ich mit HTML und PHP gut klar komme will ich mich nun ein wenig an Javascript versuchen um meine Fähigkeiten dahingehend zu erweitern. Dazu hab ich mir eine Beispielanwendung rausgesucht, die ich programmieren will. Folgendes Szenario: Ich hab einen Container (div-Tag) in dem ein Text (z.B. ein Bildtitel) steht. Durch Klick auf den Text soll dieser verschwinden und in einem input-Tag erscheinen. (Der Input-Tag soll quasi mit dem Text an der Stelle des Textes erscheinen. Damit kann der Benutzer den Text verändern. Ein Speichernbutton initialisiert nach der Änderung wieder Speichervorgang, der den geänderten Text mittels Ajax an den Server schickt und ihn dort in der DB speichert. (wobei der Serverteil jetzt für mich nicht schwierig wär). Nachdem die Speicherung abgeschlossen ist, soll der Input-Tag verschwinden und der geänderte Text wieder erscheinen. Gesehen hab ich das in einem Orion-Forum, wo das bereits Funktioniert. In diesem Forum sieht der HTML-Teil wie folgt aus: [HTML] <span class="topictitle"> <span id="topicnewest_696"> <img src="images/icon_clip.gif" alt="" border="0" /> </span> <a href="viewtopic.php?t=696" id="topiclink_13400" class="topictitle">Einladung zur 53. FAR-Sitzung</a> <span id="title_13400" style="display:none;"> <input type="text" class="post" name="topictitle_13400" id="topictitle_13400" value="Einladung zur 53. FAR-Sitzung" size="40" maxlength="60" onkeyup="AJAXTitleEditKeyUp(event, 13400)" /> <input type="hidden" id="orig_topictitle_13400" value="Einladung zur 53. FAR-Sitzung" /> <input type="button" onclick="AJAXEndTitleEdit(13400)" value="Speichern" class="mainoption" /> <input type="button" onclick="AJAXCancelTitleEdit(13400)" value="Abbrechen" class="liteoption" /> </span> [/HTML] Auf die dort verwendeten Javascriptfunktionen hab ich zwar Zugriff, aber da ich aber nicht nur blind abschreiben will, würde ich mich freuen, wenn ihr mir Ansätze geben könntet, wie so eine Funktion implementiert wird. Auch Buchvorschläge sind erwünscht. Danke für die Hilfe. PS.: Anbei hab ich nochmal ein Bild gestellt, wie das in dem Forum aussieht: Gruß Daimonion [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
PHP, Javascript, jQuery, Ajax, nodeJS, MySQL...
Javascript um text zu editieren
Oben