Unterschiedliche Inhalte in Textarea.

[WebPSM]

Hallo,

ich frage mich schon seit einer Weile, wie die Editoren im Web funktionieren. Sie werden z.B. von CMS Systemen wie Joomla eingesetzt und ermöglichen das direkt sichtbare Formatieren von Texten und einfügen von Bildern.

Das Erstellen von neuen Beiträgen in diesem Forum erfolgt über eine Textarea, in die nur TAGs einfügt werden können (Formatierungen wie fett usw. wirken sich also nicht unmittelbar auf den Text aus). Mit der gleichen Methode habe ich bisher auch gearbeitet, allerdings würde mich mal interessieren, wie diese anderen Editoren es anstellen, dass in einer Textarea (denke zumindest, dass es eine ist) direkt Formatierungen und Bilder angezeigt werden können. Ich dachte bis jetzt immer, dass Textareas dazu nicht in der Lage sind, sondern nur stupiden unfomatierten Text beinhalten können.

Wäre nett, wenn ihr mir einen Anhaltspunkt geben könntet, wie diese Editoren funktionieren.
Danke.

 

[dkdenz]

Hallo,
setze Dich hiermit mal auseinander:
http://www.fckeditor.net/

 

[WebPSM]

Ich kenne diese Seite schon, hat mich aber nicht weiter gebracht.

 

[pit-r]

Moin!

Ich kenne diese Seite schon, hat mich aber nicht weiter gebracht.

Nix für ungut, aber: wenn Dich das nicht weitergebracht hat, Du aber Ähnliches irgendwo implementieren willst, greifst Du am Besten auf sowas zurück. Derartige Editoren - wenn "freundlich" geschrieben - ersetzen bei Browsern, die mit dem Script klarkommen das (die) Textarea(s) durch andere Elemente, in denen dann 'rumgeschraubt wird. Das, was dann dort passiert, ist auch keine Hexerei aber offensichtlich zu komplex, als daß Du es selber realisieren könntest.

Fazit: verschiedene Editoren die frei (oder auch kostenpflichtig?) erhältlich sind antesten, eine Auswahl treffen und dat Ding einbauen...

Ahoi - Pit

 

[WebPSM]

Naja, wenn du mit so einer Einstellung durchs Leben gehst, dann wirst du nie wirklich etwas lernen. Ich bin grundsätzlich kein Fan davon einfach irgendwelche Sachen einzusetzen, die andere programmiert haben. Ich programmiere mir alles selbst. Und deine Vermutung, dass es zu schwer für mich ist, kann ich nicht teilen. Du solltest nochmal über deine Aussage nachdenken und dir überlegen ob du mich oder meine Fähigkeiten kennst.

 

[pit-r]

Hi!

Ich kenne weder Dich noch Deine Fähigkeiten - woher auch. Und ich wollte Dich nicht blöd anmachen, was aber scheinbar so 'rübergekommen ist. Fakt ist: derartige Editoren basieren wie gesagt auf der Ersetzung eines normalen Textareas z. B. durch einen editierbaren Iframe. Du vermutest aber trotz des "Studiums" solcher Editioren, daß es dabei um normale Textareas geht.

Wenn Du mal in die von solchen Scripts benutzen Funktionen reinschnuppern möchtest, empfehle ich das Midas Demo - es ist recht übersichtlich und im Quelltext kannst Du leicht herausfinden, wo DOM-Methoden oder aber 'document.execCommand' verwandt werden.

Auf der Seite von Microsoft gibt es eimerweise Infos, wie man sowas für IE bastelt. Hier ein Beispiel.

Naja, wenn du mit so einer Einstellung durchs Leben gehst, dann wirst du nie wirklich etwas lernen.

Wenn ich hier eine Einstellung an den Tag gelegt habe, dann Dich betreffend. Ich lerne seit annähernd 47 Jahren und beabsichtige nicht, damit aufzuhören. Dein statement bzgl. des fckeditors läßt zumindest vermuten, daß Du nicht tief genug in die Thematik eingetaucht bist, um daraus ein für Dich ausreichendes Lernresultat zu erzielen. Die Konsequenz daraus kann m. E. entweder darin bestehen, mehr über den Kram in Erfahrung zu bringen oder aber ein soches "Fremdscript" zu benutzen.

Ahoi - Pit

 

[WebPSM]

Hi!

Zum "blöd anmachen": Ist bei mir vielleicht wirklich etwas falsch angekommen. Möchte mich für meine impulsante Reaktion entschuldigen.

Zum fckeditor: Es ist nicht all zu leicht in einem fremden Quellcode von tausenden von Zeilen (verteilt auf mehrere Dateien) die entscheidenden Infomationen zu finden. Deshalb hat mir dieser Editor nicht weiter geholfen.

Zu Textareas: Ich hatte mir auch schon überlegt das Ganze ohne Textareas umzusetzen, allerdings ist dabei dann das größte Problem eine Benutzereingabe zu realisieren.

Zum lebenslangen Lernen: Ich finde es schade, dass heute viele Menschen nicht mehr bereit sind Dinge selbst zu entwickeln, sondern mit der Einstellung leben: "Ach das gibts ja schon, also kopiere ich es einfach". Das bedeutet aber gleichzeitig eine enormen Verständnis- und Qualitätsverlust. Da das Verständnis für das Erkennen der Probleme und das Finden von Lösungen auf der Strecke bleibt, sind diese Menschen schnell aufgeschmissen, wenn es mal kein "Fertigprodukt" für ihr Anliegen gibt. Der Qualitätsverlust kommt dadurch zu stande, dass Fertigprodukte immer nur bis zu einem bestimmten Grad anpassungsfähig sind und somit nicht mit einem speziell für das eigene Problem angepassten Produkt konkurrieren können.

Gruß, WebPSM

 

[pit-r]

Hi!

Würde Dir ein Beispiel mit einigen wenigen Funktionen in Sachen eigener Editor helfen? Könnte in den nächsten Tagen mal was basteln. Davon abgesehen: es ist möglich, 2-gleisig zu fahren: Textarea für Eingabe mit Pseudo-Tags (wie hier im Forum) und z. B. einen Div, der das als umgesetztes HTML darunter (oder wo auch immer) anzeigt.

Ahoi - Pit

 

[WebPSM]

Würde Dir ein Beispiel mit einigen wenigen Funktionen in Sachen eigener Editor helfen? Könnte in den nächsten Tagen mal was basteln.

Wäre echt klasse.

Davon abgesehen: es ist möglich, 2-gleisig zu fahren: Textarea für Eingabe mit Pseudo-Tags (wie hier im Forum) und z. B. einen Div, der das als umgesetztes HTML darunter (oder wo auch immer) anzeigt.

Mit dem 2-Gleis-Prinzip arbeite ich zur Zeit. Doch ist es oftmals keine optimale Lösung.


Gruß, Paul

 

[WebPSM]

Thread vergessen?

 

[bine]

hm, wie baue ich mir einen eigenen Text-Editor? Interessante Frage. Als erstes schaue ich mir das entsprechende joomla Modul an. Was man können oder zumindest ein bisschen verstehen muß ist sicher php. Das bereits gepostete Script kann sicher auch hilfreich sein. Zugegeben, anhand eines fertigen Moduls zu lernen ist nicht gerade der einfachste Weg. Und die Zusammenhänge erschließen sich nicht von selbst.

Ich kann Dir keine Antwort geben, aber wie es immer so ist hier im Forum, sind manche Fragen so interessant, das ich es selber auch wissen möchte.

Zunächst werde ich mir mein joomla Modul ansehen und dann google fragen.

Die Inhalte in diese Textarea, wie Bilder etc. werden sicher nicht klassisch eingebunden so wie man es von html und javascript kennt.

 

[bine]

also so wie ich das sehe wird erstmal alles über javascript prototypes definiert. Hier mal eben 2000 Zeilen js.
Anschließend im php-file das Ganze zusammengesetzt. Das Ganze in Template-Manier zusammengestrickt.
Ist doch ganz einfach, Geil, wenn ich das nur auch könnte

 

[Sirje]

also so wie ich das sehe wird erstmal alles über javascript prototypes definiert. Hier mal eben 2000 Zeilen js.
Anschließend im php-file das Ganze zusammengesetzt. Das Ganze in Template-Manier zusammengestrickt.
Ist doch ganz einfach, Geil, wenn ich das nur auch könnte

Nein, das Ganze hat mit PHP nichts zu tun. Reines Javascript. Ich will auch damit irgendwann klarkommen, wie das funktioniert, ich vermute ungefähr, dass die JS-funktion in einem blitzschnellen Augenblick (so, dass menschliche Auge nicht merkt) eine Textarea in einen DIV umwandelt und umgekehrt.

Es wäre sehr nett und hilfreich, wenn jemand mit einem einfachen Beispiel mehr dazu erklären könnte.

 

[dkdenz]

Ich weiss jetzt nicht, ob dies weiter hillft,
aber hierbei handelt es sich um eine ganz rudimentäre Möglichkeit,
etwas ähnliches zu realisieren:
http://forum.jswelt.de/showthread.php?t=20236&page=1&pp=15

 

[Sirje]

Ich weiss jetzt nicht, ob dies weiter hillft,
aber hierbei handelt es sich um eine ganz rudimentäre Möglichkeit,
etwas ähnliches zu realisieren:
http://forum.jswelt.de/showthread.php?t=20236&page=1&pp=15

Ja klar
Wenn aber ich den Sinn des Topics richtig verstehe , es geht um ganz Anderes.
Nämlich, es gibt solche Javascript-Editore (z.B. EWE-Editor, oder diejenige von Mambo), die ganz schlau mit Textareas arbeiten, so dass die als Teile der html-Seite aussehen - als ob man die Seite direkt editiert, nicht eine Textarea... und wie das funktioniert, das ist die Frage!

 

[dkdenz]

Danke für die Aufklärung.
Da ich aber schon im 2.Post eine Referenz gepostet hatte,
er damit aber nicht zufrieden war, weil zu kompliziert oder zu umfangreich (?),
halte ich mich jetzt an seine Aussage:

Wäre nett, wenn ihr mir einen Anhaltspunkt geben könntet, wie diese Editoren funktionieren.

Und wie geschrieben:

aber hierbei handelt es sich um eine ganz rudimentäre Möglichkeit,
etwas ähnliches zu realisieren

Das soll nur ein Denkansatz sein, wie es prinzipiell funktionieren könnte...

 

[Sirje]

Danke für die Aufklärung.
Da ich aber schon im 2.Post eine Referenz gepostet hatte,
..

sorry, der Name klang unseriös - FCKeditor, habe nicht ernst genommen.
Ja, der macht genau das. Aber auch dort steht nicht auf der Hauptseite gross geschrieben, nach welchem Prinzip es funktioniert. Es soll doch eine Hauptidee sein, die sich in einigen Wörter erklären lässt, und das ist das Interessanteste.
OK, dann lese ich fleissig den ganzen Code und capiere das selbst.

 

[ein schlauer]

Die Wörter die du suchst sind
contenteditable: http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/contenteditable.asp
und designmode http://www.mozilla.org/editor/ie2midas.html

Natürlich brauchst du eine Textarea, du willst i.d.R. das editierte Ergebniss an den Server senden, nicht nur bearbeiten.

 

[Sirje]

Die Wörter die du suchst sind
contenteditable: http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/contenteditable.asp
und designmode http://www.mozilla.org/editor/ie2midas.html

Natürlich brauchst du eine Textarea, du willst i.d.R. das editierte Ergebniss an den Server senden, nicht nur bearbeiten.

YESSS! Danke!!!

 

[pit-r]

Moin!

@Sirje: Das hätteste auch ein Dutzend Posts früher haben können (wenn auch nur so ähnlich ).

@WebPSM: was mich angeht, war dieser Thread nicht vergessen. Allerdings bin ich mir nicht darüber im Klaren geworden, was alles in so ein abgespecktes Beispiel hineingehört. Und je nachdem, was das ist, in welchen Browsern (die dazu überhaupt in der Lage sind) es funzen soll etc. etc. wird das Ding so speckig, daß Du mit den geposteten Links besser fährst. Und ob Dir hier einer was bastelt oder ob Du Dich anhand bestehender Beispiele schlau machst: selbst programmiert hast Du es dann irgendwie nicht (soll nich heißen, daß ich für meinen Teil nich basteln zu basteln bereit bin, falls Du das möchtest, spuck mal konkrete Anforderungen aus).

Ahoi - Pit