File-Upload: 'Keine Datei ausgewählt' auf dem Mac

Ein Kunde schickte mir jetzt ein für mich irritierendes Bildschirmphoto:

Ein Formular enthält ein File-Upload-Feld:

Daneben zeigt der Browser (irgendeiner auf dem Mac) an:

Das braucht natürlich Platz und stört auch durchaus. Es handelt sich um ein Formular für Personendaten, Leute können ein Photo von sich hochladen. Machen sie das und rufen sie die Seite erneut auf, erscheint so eine Meldung. Die Datei ist aber vom vorherigen Upload schon vorhanden.


Kann man das irgendwie unterdrücken? Beeinflussen? Wegmachen?

Den Ausschnitt habe ich unten angehängt. Der obere Ausschnitt zeigt das auf dem Windows-FF - alles ganz normal. Der untere Ausschnitt zeigt das auf dem Mac.

angehängtes Bild

Google Chrome auf Linux zeigt an der Stelle auch so etwas an - das liegt wohl an der Rendering Engine Webkit, die in Safari und Chrome verwendet wird

Ob und wie man diese Darstellung beeinflussen kann, weiß ich leider auch nicht

Vielleicht hilft dir das Tutorial weiter: http://www.shauninman.com/archive/2007/09/...css_and_the_dom

Danke für die Info.

Wenn das natürlich direkt von der Rendering-Engine generiert wird, dann ist das relativ unbeeinflussbar.

Das hat aber nichts wirklich mit meiner Frage zu tun. Bei Shauniman geht es um 'Gestaltungsmöglichkeiten' der Upload-Box - hier ist der Code vorhanden und wird auf einigen Browsern mit einem ganz anderen Text ausgegeben, der für Nutzer in dieser Situation sehr irritierend ist.

Hm, weiß gar nicht wo das Problem liegt, ist doch echt nicht schwer das zu lösen.
Du hast 2 verschiedene Styles, die prinzipiell so unüberwindbar sind. Also was tut man? Man ändert beide!

Folgendes Prinzip:

INPUT[file] soll ne opacity von 0 haben und damit unsichtbar
INPUT[file] liegt in einem DIV mit overflow:hidden;
das DIV hat entsprechende Größe usw. und beinhaltet ein Bild mit "Datei hochladen" --> Achtung das Bild soll (z-index) hinter INPUT[file] liegen

so, klickt er nun auf das DIV, klickt er unwissentlich auf INPUT[file] - das wars eigentlich schon. Willst du nun noch den Dateinamen anzeigen lassen, kannste das mit INPUT[file].onchange machen


//edit:

Von wegen das hilft nicht weiter:
Das ist genau das was ich grad beschrieben habe, wie ich grad merke. Hättest du es richtig gelesen...

Ich kenne den Text von shauninman schon länger.

Ein Kunde hatte mich mal nach so etwas gefragt, dann habe ich etwas damit rumexperimentiert - und das schließlich entnervt alles wieder rausgeschmissen.

Das funktionierte im FF einigermaßen - und im IE, den der Kunde nutzte, überhaupt nicht.

Nun sieht das beim Kunden ganz simpel aus (Photo hängt unten) - und funktioniert.

Es hat keinen Sinn, irgendwelche kruden Techniken zu nutzen, die dann bei Nutzern, die tausend andere Dinge zu tun haben, nicht funktionieren und die Nutzer nur von ihrer eigenen Arbeit abhalten.


PS: Ich war bis jetzt davon ausgegangen, daß diese Upload-Boxen in verschiedenen Browsern ungefähr gleichartig aussehen. Und nicht daß da ein Browser auf die Idee kommt, zusätzlichen Text einzufügen, der bei Datenbankanwendungen und dem Editieren von Datensätzen auch noch fehlende Daten suggeriert, obwohl die Daten da sind.

Eine Datei ist praktisch eine Spalte innerhalb von so einer Tabelle, die wird einmal hochgeladen, ab dann ist sie online. Anschließend kann man den Datensatz problemlos weiter bearbeiten (bsp. Personenstammdaten ergänzen), ohne daß beim Speichern das Bild gelöscht wird. Natürlich will man das Bild nicht jedesmal neu hochladen.

Als ich das heute früh gesehen hatte, dachte ich zunächst an eine besondere Einstellung, ein Plugin o.ä. Nach der Bemerkung von Jörg ist das allerdings browserspezifisch, also nicht lösbar.

angehängtes Bild

Das liegt aber bestimmt nicht am Browser. Sowas mach ich im Handumdrehen - browserweit. Heißt das liegt keineswegs an der Technik als vielmehr an deiner fehlenden Kompetenz im Bereich CSS / Webgestaltung.

Na dann ist das ja prima, wenn dein Kunde zufrieden ist

Schön, dann stelle doch mal eine funktionierende Lösung zur Verfügung.

Ich hatte damals die Lösung von shauninman eingebaut.

Das ging problemlos mit einem einzigen Button, wenn die Seite hinreichend klein war.

Das führte zu diversen Problemen, wenn man mehrere solcher Buttons nebeneinander benötigt und wenn auf der Seite gescrollt wird, weil diese Buttons zunächst nicht im sichtbaren Bereich sind.


In dem allerletzten Kommentar #29 auf der Seite von shauninman ist ein Problem erwähnt, das damals massiv auftrat.

Ich hatte mir damals gesagt: Es hat kaum Sinn, die Standard-Logik von Steuerelementen mit irgendwelchen kruden Tricks auszuhebeln, nur um eine andere Darstellung zu erreichen - wenn man sich dafür solche Probleme einhandelt. Also flogen diese Dinge wieder raus.

Wenn es bei mir in mehreren Browsern funktioniert - und beim Kunden nicht, dann wird das zum sinnlosen Zeitverschwenden, wenn die Standardfunktionalität überall problemlos klappt und für Nutzer auch verständlich ist.

Also ich persönlich kenne die Lösung von diesem shauninman nicht, habs auch nur kurz überflogen und festgestellt, dass es dasselbe Prinzip ist.

Aber mit CSS mit overflow:hidden und opacity:0 haute das bis jetzt immer hin - von IE6 bis IE8 über Firefox und Safari ... also ich weiß nicht, was ich richtig mache, aber ich wüsste auch nicht wie ichs falsch machen sollte :/