Wahlweise Dateiupload/URL angeben, wie?

[André Mantz]

Hallo zusammen,

ich hatte vor einiger Zeit schon mal hier gefragt, aber leider bisher keine wirkliche Lösung gefunden.

Mein Problem:
In einem Formular soll ein User die Möglichkeit haben, ein Bild entweder hochzuladen ODER eine URL zu seinem Bild anzugeben.

Hierzu habe ich zwei Formularfelder. Ein Feld TYPE=INPUT und ein Feld TYPE=FILE. Ich möchte allerdings verhindern, dass der User beides gleichzeitig tut, nämlich eine URL angeben UND eine lokale Datei auswählen.

Versucht hatte ich per JS bei Änderung eines der beiden Felder, den Inhalt des jeweils anderen mit "document.formular.feld.value = ''" zu löschen.
Leider geht das nicht mit dem FILE-Feld, weil dies vom Browser verhindert wird.

Wer kann mir einen Lösungsvorschlag machen?

Danke für Eure Hilfe

Gruß, André

[Dennis]

Hi @all!

ich hatte vor einiger Zeit schon mal hier gefragt, aber leider bisher keine wirkliche Lösung gefunden.

vielleicht gibt es dann gar keine?

Versucht hatte ich per JS bei Änderung eines der beiden Felder, den Inhalt des jeweils anderen mit "document.formular.feld.value = ''" zu löschen.
Leider geht das nicht mit dem FILE-Feld, weil dies vom Browser verhindert wird.

Das muss auch aus Sicherheitsgründen so sein.

Wer kann mir einen Lösungsvorschlag machen?

Steht dir PHP zur Verfügung? Dann würde ich dir raten:
Frage den Besucher mittels zwei Radioboxen ab, was er angeben will (oder auch Dropdownliste) und erzeuge daraufhin das entsprechende Feld.

MfG, Dennis.

[André Mantz]

Hallo Dennis,

ich hatte vor einiger Zeit schon mal hier gefragt, aber leider bisher keine wirkliche Lösung gefunden.

vielleicht gibt es dann gar keine?

Genau das versuche ich ja herauszubekommen :-)

Versucht hatte ich per JS bei Änderung eines der beiden Felder, den Inhalt des jeweils anderen mit "document.formular.feld.value = ''" zu löschen.
Leider geht das nicht mit dem FILE-Feld, weil dies vom Browser verhindert wird.

Das muss auch aus Sicherheitsgründen so sein.

Ist mir bekannt ... wobei das Löschen des Feldinhaltes ja unbedenklich ist, lediglich das Füllen mit einem bestimmten Wert wäre kritisch

Steht dir PHP zur Verfügung? Dann würde ich dir raten:
Frage den Besucher mittels zwei Radioboxen ab, was er angeben will (oder auch Dropdownliste) und erzeuge daraufhin das entsprechende Feld.

Jepp, das Formular wird mit PHP verarbeitet. Allerdings müsste ich bei diesem Vorschlag eine weitere Seite "zwischenschalten". Da es mir hier um Benutzerfreundlichkeit geht, wollte ich das verhindern.

Gruß, André

[Dennis]

Hi @all!

"document.formular.feld.value = ''" zu löschen.
Ist mir bekannt ... wobei das Löschen des Feldinhaltes ja unbedenklich ist, lediglich das Füllen mit einem bestimmten Wert wäre kritisch

Wenn die Methode oben funktionieren würde, wäre es auch kein Problem, ein Feld zu füllen!!

Jepp, das Formular wird mit PHP verarbeitet. Allerdings müsste ich bei diesem Vorschlag eine weitere Seite "zwischenschalten". Da es mir hier um Benutzerfreundlichkeit geht, wollte ich das verhindern.

Das kann man auch alles in eine seite packen, wenn du willst, kann ich dir ja mal ein beispielscript machen

MfG, Dennis.

[Dennis]

Hi André,

schau mal hier: http://www.riehle-web.com/script.txt
da steht ein komplettes Script, welches ich noch hatte.

Etwas angepasst, passt es genau für dich, du musst nur noch in Zeile 30
den Dateinamen von deinem PHP Script, welches die Daten weiterverarbeitet eingeben.

MfG, Dennis.

[André Mantz]

Hallo Dennis,

schau mal hier: http://www.riehle-web.com/script.txt
da steht ein komplettes Script, welches ich noch hatte.

Danke für den Tip.Es geht aber tatsächlich auch so, wie ich mir das vorgestellt hatte. Nach einigem rumprobieren bin ich mittlerweile selbst draufgekommen.

Der Trick ist, dass man das FILE-Feld gar nicht leer macht, sondern löscht und durch ein neues FILE-Feld ersetzt. Das geht mit einem recht kompakten Zweizeiler.

Also, mal zur Erläuterung, dies ist mein Formular:

<form name="testform" action="test.html" method="post" enctype="multipart/form-data">
<input type="text" name="url" value="" onBlur="if(this.value) DatLeer()"><br>
<input name="datei" type="file" onChange="document.testform.url.value=''"></form>

und dazu gehört dieses Script:

function DatLeer()
 {
  with (document.testform)
      replaceChild(lastChild.cloneNode(false), lastChild);
 }

Das Script wird aufgerufen, wenn das Eingabefeld für eine URL verlassen wird und das Feld mit einem Wert gefüllt ist (onChange führt bei einem TYPE=TEXT Feld unter IE zu einem Fehler, wenn Autovervollständigen aktiviert ist).
Es ersetzt einfach das Upload-Feld durch eine Kopie von sich selbst, wobei zwar alle Attribute, aber eben nicht der Inhalt übernommen werden.

Bei Änderung des Upload-Feldes wird der Inhalt des URL-Feldes einfach per VALUE='' gelöscht.

Das ganze kann man sich unter http://www.webmantz.de/formtest.html in Aktion anschauen.

Gruß, André

[Dennis]

Hi @all!

Das ganze kann man sich unter http://www.webmantz.de/formtest.html in Aktion anschauen.

Und funzt bei mir überhaupt nicht, stimmt, ich hab im Moz ja Javascript deaktiviert.

Mal schnell mit dem IE anschauen - ja da gehts, obwohl es etwas verwirrend ist.

Also mal ehrlich: Mit dem Script kriegst du maximal 50% aller Absendungen gefiltert!!!
Ich würde dir tunlichst zum PHP raten, das fertige Script steht da, läuft und alles ist perfekt.

Was will man mehr? Zumal PHP wirklich 100% sicher ist!

MfG, Dennis.

[André Mantz]

Hallo Dennis!

Und funzt bei mir überhaupt nicht, stimmt, ich hab im Moz ja Javascript deaktiviert.

Nun, wenn du JS deaktiviert hast, dann mußt du halt auf diese Art der Benutzerfreundlichkeit verzichten.

Also mal ehrlich: Mit dem Script kriegst du maximal 50% aller Absendungen gefiltert!!!

Nun, meine Erfahrungen sind da allerdings ganz andere. Es dürften eher > 95% aller User sein, die JS aktiviert haben.

Ich möchte hier keine Diskussion pro/contra JS provozieren. Ich habe mich nun mal für JS entschlossen.

Gruß, André

[Dennis]

Hi @all!

Nun, wenn du JS deaktiviert hast, dann mußt du halt auf diese Art der Benutzerfreundlichkeit verzichten.

Hm, Benutzerfreundlichkeit? Was anderes fällt dir wohl nicht ein, oder? ;-)

Ich dachte eigentlich, dass es nicht erlaubt seie, zwei Sachen einzugeben. Und wie machst du das jetzt beim Auswerten? was, wenn da in beiden Variablen was drin steht?

Ich möchte hier keine Diskussion pro/contra JS provozieren. Ich habe mich nun mal für JS entschlossen.

Provozieren? hm, ich würde es anfangen nennen. Btw. Ich würde mich da nicht für PHP entscheiden.

MfG, Dennis.

[wahsaga]

hi,

Hierzu habe ich zwei Formularfelder. Ein Feld TYPE=INPUT und ein Feld TYPE=FILE. Ich möchte allerdings verhindern, dass der User beides gleichzeitig tut, nämlich eine URL angeben UND eine lokale Datei auswählen.

was wäre tragisch daran?
wenn er es wider deinen hinweis doch tut, dann entscheidest du halt serverseitig, welches die höhere priorität haben soll - oder lässt ihm auf einer weiteren zwischenseite die wahl, welcher "wert" nun genommen werden soll.

Versucht hatte ich per JS bei Änderung eines der beiden Felder, den Inhalt des jeweils anderen mit "document.formular.feld.value = ''" zu löschen.
Leider geht das nicht mit dem FILE-Feld, weil dies vom Browser verhindert wird.

evtl. lässt sich ein file-inputfeld ja dynamisch auf disabled setzen - dann dürfte das bild auch gar nicht mehr an den server übertragen werden.

gruss,
wahsaga

[André Mantz]

Hallo wahsaga

... Ich möchte allerdings verhindern, dass der User beides gleichzeitig tut, nämlich eine URL angeben UND eine lokale Datei auswählen.

was wäre tragisch daran?

Es geht mir einfach um Benutzerfreundlichkeit.

Versucht hatte ich per JS bei Änderung eines der beiden Felder, den Inhalt des jeweils anderen mit "document.formular.feld.value = ''" zu löschen.

evtl. lässt sich ein file-inputfeld ja dynamisch auf disabled setzen - dann dürfte das bild auch gar nicht mehr an den server übertragen werden.

Das bedeutet aber, wenn der User einmal eine URL eingegeben hat, kann er sich nicht mehr umentscheiden um eine lokale Datei auszuwählen

Gruß, André

[Mark]

Nehm doch einfach eine checkbox mit der man bei Aktivierung das eine Feld und bei Deaktivierung das andere Feld auf "disable" setzt. Vor die checkbox kannst du ja eine Frage stellen wie: "Wollen Sie einen externen Pfad zu einem Bild angeben?" Wenn du dann die checkbox aktivierst wird das das Input-->Type=Field auf "disable gesetzt"!

[André Mantz]

Hallo Mark,

Nehm doch einfach eine checkbox mit der man bei Aktivierung das eine Feld und bei Deaktivierung das andere Feld auf "disable" setzt. ...
Wenn du dann die checkbox aktivierst wird das das Input-->Type=Field auf "disable gesetzt"!

Das wäre eine Lösung ... ist zwar nicht ganz so elegant wie eine "Vollautomatik", aber besser als nix. Danke

Gruß, André

[eisbaer04]

Hallo zusammen,

Hi,

Mein Problem:
In einem Formular soll ein User die Möglichkeit haben, ein Bild entweder hochzuladen ODER eine URL zu seinem Bild anzugeben.

Hierzu habe ich zwei Formularfelder. Ein Feld TYPE=INPUT und ein Feld TYPE=FILE. Ich möchte allerdings verhindern, dass der User beides gleichzeitig tut, nämlich eine URL angeben UND eine lokale Datei auswählen.

Wer kann mir einen Lösungsvorschlag machen?

Ich probiers mal ;-).
Ich würde nur ein Feld vom Typ FILE machen. In dieses Feld kann man ja auch einfach eine URL eintragen. Wenn der User nun will, kann er auf den Durchsuchen-Button klicken und eine Lokale Datei wählen, wenn nicht, kann er einfach eine URL eintragen. Das ist für mich viel Benutzerfreundlicher, da der Benutzer sich nicht darum kümmern muss, in welches Feld er tippt.
Das ganze würde ich dann an dein PHP-Script (oder sonstige Serverseitige Sprache) - die du ja haben solltest, wenn du Dateien hochladen willst - schicken, und dann mit Regulären Ausdrücken überprüfen, ob es sich um eine URL oder eine Lokale Pfadangabe handelt.

Danke für Eure Hilfe

Gruß, André

Thats all Folks
 eb4

[André Mantz]

Hallo,

Ich probiers mal ;-).
Ich würde nur ein Feld vom Typ FILE machen. In dieses Feld kann man ja auch einfach eine URL eintragen.

Also, mir steht ja in PHP ein hochgeladenes Bild zur Verfügung, aber nicht der Text, den der User im Upload-Feld eingetragen hat. Trägt er also eine URL ein, so bekomme ich davon nichts mit ... oder?
Ansonsten wäre diese Lösung ja tatsächlich die beste überhaupt.

Gruß, André