[Gelöst] Table-Creator, Hilfe bei string.replace() benötigt

Moin Leute,
wie sollte es anders sein, ich hab auch mal eine Frage bzw. eine Bitte um Hilfe an euch.
Und zwar gehe ich mal davon aus, dass ihr alle wisst, was BBcodes sind (wenn nicht, dann macht mal die Augen auf, sind direkt über dem Textfeld beim verfassen eines Beitrags zu finden ).

Wir haben in unserem IP.Board einen Satz benutzerdefinierter BBcodes angelegt, um den Usern die Möglichkeit zu geben eine Tabelle zu erstellen (bis jetzt bin ich zwar der einzige der das nutzt, aber das könnte sich ja noch ändern).
Allerdings ist so eine Anreihung von [table]-, [tr]-, [th]- und [td]-Codes nicht so jedermanns Sache, und deshalb wollte ich ein kleines Tool erschaffen, um ihnen unter die Arme zu greifen.

Was soll dieses Tool nun machen?
Erstmal soll der User es aufrufen und auf nen Button klicken, der ne Funktion durchläuft und abfragt, wie die Tabelle aussehen soll (Reihe, Spalten, Spaltenbreiten…), das erscheint mir aber als recht einfacher Teil und deshalb habe ich das erst einmal in den Hintergrund gestellt.

Womit ich begonnen habe, ist eine Seite zu erstellen, auf der es einen (div-)Vorschau Bereich gibt, sowie eine Textbox in der der BBcode editiert wird.

Nun soll eben genannte Funktion später mal in diese Textbox das BBcode-Konstrukt einfügen und automatisch eine weitere Funktion aufrufen(, die ebenfalls über einen Button erreichbar ist).
Diese Funktion wiederum soll nun den BBcode in den entsprechenden HTML-Code umwandeln, dafür habe ich mir als “einfache” Methode ausgedacht, dass der Text über das value-Attribut (Zwischenfrage: textarea ist ja ein HTML Element mit öffnendem und schließendem Tag, logischerweise würde doch innerHTML mehr Sinn machen, oder? Nur das funktioniert nur insofern, dass der Ursprüngliche Textinhalt ausgegeben wird.) der Textarea entnommen wird und mit mehreren .replace() Nutzungen abgeändert werden soll, bis es schließlich via innerHTML in den (div-)Vorschau Bereich geschrieben wird.

Gleiches soll andersherum auch funktionieren, der HTML Code sollte auch wieder in BBcode umgewandelt werden können, da der Nutzer die Tabelle bzw. den Inhalt einer Zelle auch ändern kann, indem er doppelt auf Entsprechende klickt und den Text editiert (Textbox erscheint in der Zelle), eine via onblur aufgerufene Funktion schreibt den Inhalt aus der Textbox wieder in die Zelle.

Nur bei diesen replace() Funktionen liegen meine Probleme, es wird nicht das ersetzt, was ich gerne hätte.
Da ich weiß, dass ihr mit Quelltext mehr als meinem ganzen Geschwafel etwas anfangen könnt, hier ist was ich bisher zusammengebastelt habe (in txt Form, um das hier zu posten wäre es zu viel; ändert einfach die Endung des Links auf .html um die Seite selbst zu sehen). Ich weiß es ist noch nicht valide zu irgendeinem Standard, aber das kommt später, erstmal Zählen die inneren Werte .

Hoffe ihr könnt mir ein Paar Denkanstöße geben,
LG, Mini-Me

Das macht man üblicherweise nicht, in dem man bereits bearbeiteten Text speichert - sondern Rohdaten.

Wenn der Nutzer editieren möchte, bekommt er genau das wieder vorgesetzt, was er eingegeben hat - weil auch genau das in der Datenbank abgelegt wurde.
Umgewandelt wird nur bei der Ausgabe.

Also entweder missverstehe ich dich jetzt oder du mich.

Ersteinmal gibt es bei mir ja keine Datenbank, lediglich eine HTML Datei, die mit Javascript gespickt ist und 2 Bereiche enthält, eine Textarea und ein div-Element.
Nach Aufruf der Seite fügt der Benutzer entweder ein bestetehendes BBcode Konstrukt in die Textarea ein, oder er lässt sich eins über einen entsprechenden Button erstellen.

Dann soll er oben in der Tabelle nur noch den Textinhalt der einzelnen Zellen ändern müssen, denn so ein BBcode wird doch leicht unübersichtlich, da er keinerlei Zeilenumbrüche enthalten darf, ansonsten würde das IP.Board diese in
-Tags umwandeln, die hinter dem Öffnenden

-Tag stehen; Das Ergebnis ist unschön.
Außerdem habe ich es auch festgestellt, dass den Usern die ganzen Tags auch überhaupt nichts sagen und sie nicht wissen, wie sie angeordnet werden müssen, oder was das Ende einer Zelle/Spalte/Zeile darstellt.

Als letztes soll er sich alles wieder als BBcode ausgeben lassen um es zu kopieren und im von der Seite unabhängigem Forum einzufügen.

Würde ich ihn nur im BBcode rumwursteln lassen, würde es ihm auch nicht helfen, ich will es ja damit einfacher machen.

P.S.: Obwohl ich meinen ersten Post zwar noch einmal vorm Absenden durchgelesen habe ist mir erst jetzt in deinem Zitat aufgefallen, dass es dort nicht Spalte, sondern Zelle heißen müsste, werde ich mal ändern.

Edit: Im selfHTML Forum waren sie schneller und haben mir die benötigte Antwort geliefert, dieses Problem ist also gelöst.

Wen es interessiert: Ich habe das Projekt jetzt mal vollendet. Das ganze ist XHTML 1.0 und CSS 2.1 valide und funktioniert in allen mir bekannten Browsern:

Verbesserungsvorschläge sind Willkommen :slight_smile:.
LG, Mini-Me

EDIT: Meinungsänderung nach Anstacheln durch nen Kumpel. Internet Explorer scheint jetzt auch zu funktionieren.

Hi,

der Validator des w3c behauptet zwar, dass die Seite valides XHTML. Das mag zwar insofern Stimmen, dass die Seite syntaktisch korrekt ist, jedoch ergibt die Seite semantisch keinen Sinn. XHTML ist eine Auszeichnungssprache, das bedeutet dass damit der Inhalt nach seiner Bedeutung entsprechend ausgezeichnet wird. Als erstes solle man eine Seite komplett ohne CSS entwerfen, und nur darauf achten, dass alles Korrekt ausgezeichnet ist. Danach kannst du der Seite mit CSS auch ein hübsches Layout geben.
Du verwendest z.B. auf deiner Seite Tabellen, zum Design der Seite, was vollkommener Schwachsinn ist, da du keinen Inhalt darstellst, der in Tabellen zu Ordnen ist.

Danke erstmal für die Antwort, michi1234.

Ja, da hast du recht. Eigentlich sind die verwendeten Tabellen nicht wirklich sinnvoll eingesetzt. Der Ganze äußere Rahmen um den eigentlichen Inhalt der Seite entstammt einem InvisionFree Forum (IPB 1.3.x), für das ich diesen Aufbau von einem IP.B 2.3.x portiert habe. Da das Invisionfree Forum aber schon generell mit genauso sinnfreien Tabellen in einem Bereich (in den ich nicht eingreifen kann) arbeitet, habe ich das so belassen.
Nun habe ich zunächst den inneren Inhalt dieses Table-Creators erstellt, also den inhaltlichen Aufbau, sowie die verwendeten Scripts. Dann habe ich das ganze dem Forum angepasst, indem ich css-Inhalte rüberkopiert habe. Nach einiger Zeit habe ich dann aber die Idee bekommen, ich könne das ganze ja auch in dem Rahmen des Forums, zusammen mit dessen Links erscheinen lassen, also habe ich dies vom Invisionfree Forum rüber kopiert und ein klein wenig angepasst. Das hat dann aber auch die recht sinnfreien Tabellen mitgebracht, über die ich nicht weiter nachgedacht habe, danke für deinen Hinweis hier.

Nun frage ich mich aber, wie ich das am besten realisieren soll die semantisch schlechten Dinge zu ersetzen. Würde es mehr Sinn machen, z.B. die Tabellen durch div-Elemente zu ersetzen, sodass jeder Rahmenteil sein eigenes bekommt? Wie erreiche ich das dann, dass der Rahmen 930px breit ist und die Rahmenelemente (-> Bilder) sich so verteilen, wie gewollt, also dass der rechte Rahmen rechts und die untere rechte Ecke unten Links ist? Wäre das durch ineinandersetzen mehrerer div-Elemente sinnvoll?

Oder was wäre empfehlenswerter?