Textformatierung-Buttons für eine Textarea
Hi!
Was ich will ist eigentlich recht einfach erklärt: ZB hier auf supportnet.de seh ichs auch grad vor mir. Eine textarea mit Buttons um den Text den man hier eingibt zu formatieren, also zb der "Quote" oder "Code" oder "B" button, die entsprechend die tags für die formatierung in den bestehenden text in der textarea einfügt.
Sowas würd ich auch gern für meine page haben, aber wie genau mach ich das? Kann zwar den HTML-code von der Seite hier anschauen, aber wirklich schlauer macht mich das noch nicht. Ich seh das Javascript zum einsatz kommt..
Kann mir jemand erkären wie ich sowas selbst machen kann?
Die Daten die ich in meine textarea eingeb werden in ner mySQL gespeichert. Wenn sie wieder aufgerufen werden, zB um sie im Browser darzustellen, dann sind sogar die newlines (ich nenns mal so) weg. Wenigsten hiefür wär ne lösung toll... scheint hier ja ohne zu Funktionieren...
Wär echt super!
Danke schonmal und viele Grüße
Jörg
Antwort schreiben
Antwort 1 von Supermax vom 13.09.2019, 16:16 Options
1. die Newlines sind nicht "weg", aber für den Browser ist das Zeilenvorschubzeichen dasselbe wie ein Leerzeichen, um einen Zeilenvorschub darzustellen mußt du explizit <br> eingeben bzw. den Text der aus der DB kommt mit nl2br() ausgeben, also
echo nl2br($text);
Antwort 2 von son_quatsch vom 13.09.2019, 16:20 Options
Da wäre die Funktion
nl2br() unter PHP sicherlich eine Hilfe. Wobei man aber noch mehr beachten muss (was passiert z.B., wenn du in deinem Textarea-Text das Wort "</textarea>" mit ausgeben würdest?
Zu dem JavaScript: einfach ist es nicht - erst recht nicht, wenn es für alle Browser klappen soll. Am besten guckst Du Dir an, wie das hier gemacht wurde und schlägst dann Schritt für Schritt alle JavaScript-Methoden auf
selfHTML nach.
Antwort 3 von Supermax vom 13.09.2019, 16:34 Options
Für das erstgenannte Problem kann man einfach htmlspecialchars() verwenden, also
echo nl2br(htmlspecialchars($text));
. Dabei werden zuerst die Zeichen, die in HTML besondere Bedeutung haben, wie Anführungszeichen und spitze Klammern, durch die HTML-Escapesequenzen ersetzt, und danach alle Zeilenvorschübe durch <br> ersetzt.
Antwort 4 von _mpact vom 13.09.2019, 17:07 Options
Super schonmal!
das mit
nl2br(htmlspecialchars($text));.
funktioniert super! damit is das eigentlich wichtigste Problem gelöst. Das andere mit den Buttons wäre von daher nur noch n nettes gimmick.. Aber ich schaus mir mal an, wenn ch zeit und lust hab und poste dann meine erfahrungen, wenns geklappt hat ^^
Danke nochmal!
Antwort 5 von Supermax vom 13.09.2019, 17:29 Options
Such mal in google nach "bbcode", da findest du auch einige Beispiele wie man das eingabeseitig löst als auch wie man die Pseudocodes dann in HTML-Code umwandelt.
Alternativ gibt es auch eine Reihe von fertigen Editor-Komponenten, manche kostenpflichtig, andere freeware bzw. open source, die auf JavaScript-fähigen Browsern ziemlich mächtige Funktionen zur Verfügung stellen.