XProfan

Deutsch

Thomas
Zielinski

Hallo Leute,
ich versuch gerade ein CMS zu basteln. Bis auf eine kleinigkeit läuft auch alles. Das einzigste was mir Sorgen bereitet, ist der Editor für neue Beiträge. Ähnlich dem Editor hier in der Community soll man bestimmte Tags per Button direkt einfügen können. Das Problem liegt nun bei den Bildern.

Es ist unbekannt wie viele Bilder verwendet werden. Daher muss die eingabe der Bilder die Hochgeladen werden sollen Dynamisch sein. Das wird von der Funktion newImage() gelöst. Zumindist fügt diese neu Inputfelder type="file" ein. Eigentlich wollte ich die Pfade zum späteren Hochladen per Post an die entsprechende Seite senden, allerdiengs gehen dabei die Pfade verloren. Also dacht ich mir, vorher die Daten in ein Hiddenelement umzuspeichern (Solange man die Seite nicht verlässt bleibt der Pfad im Value des Input type="file"). Ich könnte vorher die Daten an eine JS-Funktion senden ins Hiddenelement speichern unnd dann weiter an die Seite zum auswerten senden. Dazu bin ich aber zu doof --> HILFE! Wie geht das?

Durch ein Klick auf den Button rechts neben dem Input type="file" soll dann der Tag in das Textarea eingefügt werden ([IMG SRC="entsprechender Pfad"]). Doch wird dieser Button dynamisch über die Funktion newImage() eingefügt und alle Versuche dort ein onClick einzufügen so wie ich es bei denn statischen Buttons gemacht habe. Allerdings war es mir nicht möglich, dieses onClick mit einzubauen. Also auch hier: Wie geht das?

Dank schonmal im Vorraus.

Folgender Script(JS):
(komplet Sichtbar unter [...]

)

Kompilieren Markieren Separieren

<?php Echo blub:.$_POST[bildpfad1]; ?>
<script type="text/javascript">
<!--
var bildzahl = 0;

function addText(area,typ) {

    if (typ == b1) {

        area.value += "[B]";
        the_button = document.getElementById(fett1);
        the_button.style.display = none;
        the_button = document.getElementById(fett2);
        the_button.style.display = ;

    }

    else if (typ == b2) {

        area.value += "[/B]";
        the_button = document.getElementById(fett2);
        the_button.style.display = none;
        the_button = document.getElementById(fett1);
        the_button.style.display = ;

    }

    //... und so weiter alle Buttons durch

}

function newImage() {

    bildzahl++;
    var Ausgabebereich = document.getElementById("Bilder");
    var myINPUT = document.createElement("input");
    myINPUT.type = file;
    myINPUT.size = 45;
    myINPUT.name = IMGINPUT+bildzahl;
    Ausgabebereich.appendChild(myINPUT);
    var myHIDDEN = document.createElement("input");//<-- hiddenelement in das vor dem Senden der Pfad gespeichert werden soll um ihn nicht zu verlieren.
    myHIDDEN.type = hidden;
    myHIDDEN.name = bildpfad+bildzahl;
    myHIDDEN.value= ;
    Ausgabebereich.appendChild(myHIDDEN);
    var myBUTTON = document.createElement("input");//<-- onClick-Ereigniss einsetzen ähnlich addText() mit IMG
    myBUTTON.type = button;
    myBUTTON.value = Bild einfügen;
    Ausgabebereich.appendChild(myBUTTON);
    var myBR = document.createElement("br");
    Ausgabebereich.appendChild(myBR);

}

//-->
</script>
<form action="<?php Echo $_SERVER[PHP_SELF]; ?>" method="POST">
<textarea name="blubtext" rows="20" lang="de" cols="53"></textarea><br>
<input type="button" value="Fett" onClick="addText(this.form.blubtext,b1)" id="fett1">
<input style="display:none" type="button" value="/Fett" onClick="addText(this.form.blubtext,b2) " id="fett2">
<input type="button" value="Kursiv" onClick="addText(this.form.blubtext,k1)" id="kursiv1">
<input style="display:none" type="button" value="/Kursiv" onClick="addText(this.form.blubtext,k2) " id="kursiv2">
<input type="button" value="U" onClick="addText(this.form.blubtext,u1)" id="unter1">
<input style="display:none" type="button" value="/U" onClick="addText(this.form.blubtext,u2) " id="unter2">
<input type="button" value="&Uuml;berschrift" onClick="addText(this.form.blubtext,h1)" id="h1">
<input style="display:none" type="button" value="&Uuml;berschrift" onClick="addText(this.form.blubtext,h2)" id="h2">
<input type="button" value="Table" onClick="addText(this.form.blubtext,t1)" id="t1">
<input style="display:none" type="button" value="/Table" onClick="addText(this.form.blubtext,t2)" id="t2">
<input type="button" value="Tr" onClick="addText(this.form.blubtext,tr1)" id="tr1">
<input style="display:none" type="button" value="/Tr" onClick="addText(this.form.blubtext,tr2)" id="tr2">
<input type="button" value="Td" onClick="addText(this.form.blubtext,td1)" id="td1">
<input style="display:none" type="button" value="/Td" onClick="addText(this.form.blubtext,td2)" id="td2">
<input type="Submit" value="Save" id="saveacomment">
<div id="Bilder"><input value="Neues Bild laden" type="button" onClick="newImage();"><br></div>
<script type="text/javascript">newImage();</script>
</form>

Gruß Thomas

XProfan X4; Win10 x64
Der Kuchen ist eine lüge!

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Zum Text+Bild gibt es zur Zeit 2 gängige Möglichkeiten, ein Applet (Java) oder ein editierbarer Body (Contenteditable).

Ein einfaches Beispiel für Variante 2 zeigt vBulletin z.B. bei Paule [...]

. (eingeloggt sein) (Klick die Smilies.)

Das ist das "gängige" Prinzip was auch leicht adaptierbar ist.

Die ganzen anderen Probleme lösen sich mit einer Session bzw. mit einem Cookie, ansonsten nur per Variablenweitergabe von Formular zu Formular.

Du kannst Dein Hochladeformular auch in ein hidden Iframe lenken per Target, die dahinterliegende PHP kann JavaScript zurücksenden an Top wie <script>top.myInsertToMyEdit("someText")</script> um die "Antwort" in Dein Edit zu senden.

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Thomas
Zielinski

Ich hab das gefühl du verstehst mich falsch.
Beim ersten Punkt werd ich das mit denn Keksen machen oder Session. Mal sehn worauf ich lust bekomme.
Was den Zweiten unkt angeht reden wir einander vorbei. Ich will nicht das Bild direkt einfügen. Ist mir schnuppe. Ist schließlich ja nur für schreiber. Sondern ein Tag in das Textarea ala [IMG SRC="entspechender Pfad"]. Für normal würde Ich hier den Button so gestalten <input type="button" onClick="der funktionsaufruf">. Nur bekomme ich hier:

Kompilieren Markieren Separieren

var myBUTTON = document.createElement("input");
myBUTTON.type =button;
myBUTTON.value =Bild einfügen;
Ausgabebereich.appendChild(myBUTTON);

kein onClickereigniss mit herrein was dann auslösen würde. Das soll ja dynamisch sein. Beim Hochladen von Anhängen hier in der Community funktioniert die Anzahl der Felder zum eintragen doch auch Dynamisch, iF.
Gruß Thomas

XProfan X4; Win10 x64
Der Kuchen ist eine lüge!

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Dazu war der Tip gedacht:

Du kannst Dein Hochladeformular auch in ein hidden Iframe lenken per Target, die dahinterliegende PHP kann JavaScript zurücksenden an Top wie <script>top.myInsertToMyEdit("someText")</script> um die "Antwort" in Dein Edit zu senden.

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Ah, mir ist eingefallen wo ich das so tu - im aktuellen smallBum [...]

!

Sogar gleichzeitig bis zu 5 Downloads.

(diese Variante lässt sich auch grob erweitern)

Kompilieren Markieren Separieren

;if ($_FILES[postfilein][size]>$_smallbum_conf[MaxUploadSize])
die("< script style=text/javascript>;top.gal_ui_upfreset(".$uploadTargetForm.")< /script>")

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Thomas
Zielinski

Ah okay. Hat ich übersehn. Ich versuchs mal. Das klingt gut.

XProfan X4; Win10 x64
Der Kuchen ist eine lüge!

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Habe ich erst danach angefügt, "Nachtrag:" hat gefehlt, hast Du also wahrscheinlich garnicht mal übersehen.

Mist, hab schon wieder ne Idee.

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Thomas
Zielinski

Rück ruhig immer raus damit. Ich hab zwar nur rudimentärste Grundkentinisse von JS aber ein Plan B kann nie schaden.
Gruß Thomas

XProfan X4; Win10 x64
Der Kuchen ist eine lüge!

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren

Sorry, keine zum Thema.

Das Stabilste ist wirklich wenn Du das < form target="myIframe" ... > als Antwort ein < script type="text/javascript" >;top.eineFunc("[insertText]")< /script > zurückgeben lässt. Im main halt eine function eineFunc(s){ die s dann ins Edit einfügt. Dadurch das Du dem Form auch ein onSubmit verpassen kannst, kannst Du sogar dynamisch das form.target ändern.

So gesehen ist JS wie XProfan ein Schlaraffenland. ^^ (und PHP natürlich auch)

25.06.2009 ▲

Vollständiges Zitat

Absatzweise zitieren Zeilenweise zitieren