[HTML] Styling buttonu v tagu <input type="file">
Zdravim,
Uz som vycerpal asi vsetky moznosti ohladom stylingu tohto buttonu... potrebujem taku banalnu vec ako zmenit vyzor buttonu v tomto tagu... najlepsie by bolo nahradit tento button nejakym image... Urobil som akysi ocny klam, kde cely tag je neviditelny a nad tlacidlom "Browse..." som umiestnil image s tym, ze onclick vyvola prave ten "Button..." nie image... (z-index, filter:alpha(opacity: 0)) ale ma to jednu nevyhodu... v takomto pripade sa nemoze do okienka manualne vpisat nazov suboru, pretoze po odoslani formy sa subor aj tak neodosle... subor sa odosiela ako stream... riesil uz niekto nieco podobne?
Vdaka...
zrejme prestudovane, ze?:
formulare-4.html
btw. alpha filter tusim nefunguje v Mozille (alebo je to IE6?)
Mozilla ma nejaky moz-opacity alebo take nieco... ale o to nejde... ide mi o oklamanie spravneho input file cez nejaky fiktivny image...
Pozrel by som si toto: inputfile.html.
Funguje to tak, že nad obrázkovým inputom je priehľadný input type=file, takže keď klikne niekto na miesto, kde má byť tlačidlo Browse, tak klikne naozaj na to tlačidlo, len ho nevidí.
Ano... presne tak som to aj robil, akurat to ma jednu nevyhodu ako som pisal na zaciatku... nemoze sa do toho inputu pisat, pretoze subor sa posiela ako stream a do parsera ani nedojde... ak sa tymto sposobom vyberie (klikne sa na button - image), funguje to v poriadku... ale nemozem cez klavesnicu napisat cestu k suboru a odoslat... v takomto pripade do parsera subor nepride... nefunguje ani:
V takomto pripade sa nemoze do toho fiktivneho inputu nic napisat, pretoze aj tak to nedojde na server... musi sa dat pisat do toho inputu a normalne sa aj odosielat... len neviem najst sposob ako na to...
edit: forma sa odosiela ako multipart/form (encoding)
Na tej stránke je ukážka, že to ide - keď klikneš na ten priehľadný input type=file, tak môžeš napísať názov súboru. Síce nevidíš, že to píšeš priamo do toho, ale pomocou JavaScriptu sa tam zobrazuje vpísaný text v inom elemente. Keď to zobrazenie textu budeš volať navyše aj počas písania, tak by to mohlo byť akceptovateľné.
Dobre... tak este raz a pomaly... :) klikne sa na priehladny input type=file --> funguje - vyberies subor --> submit formy --> vsetko OK... funguje to tak ako ma... ale co v pripade, ked tam nazov suboru manualne napises? sice to v ukazke nevidis, ze pises, ja som si to urobil tak, ze vidim co pisem... lenze... dajme tomu, ze to je tak ako v tej ukazke... napises manualne nazov suboru (samozrejme, ze ho pises do fiktivneho input type=text, pretoze input type=file je neviditelny)... nas fiktivny input type=text musi byt umiestneny presne nad neviditelnym input type=file aby to bolo realne... fungovalo by to mozno takym sposobom ak: pises do neviditelneho input type=file a javascriptom prepisujes text do fiktivneho input type=text. Lenze toto nedokazes umiestnit tak, aby to bolo na sebe... ja to potrebujem mat na sebe kvoli tomu, aby si videl co pises... chapes? Predsa to nemoze fungovat tak, ze nevidis co pises... Jedine, co v tej ukazke funguje, je ostylovanie input textu v tagu input type=file... ak neveris, ze taketo riesenie nefunguje, urob si priklad... alebo ti poslem svoj priklad...
Potrebujem len tieto veci... vlastny button, ktory vyvola dialogove okno na vyber suboru s tym, ze nazov suboru si mozes sam zadat... samozrejme za podmienky, ze to co pises aj vidis...
Samozrejme, že ho píšeš do input type=file, keďže ten je umiestnený nad input type=text. Všetko čo napíšeš, zobrazíš ďalej JavaScriptom. Síce nevidíš kurzor (alebo aspoň nie na správnej pozícii), ale je to akceptovateľné.
Ano... v takomto pripade to bude akceptovatelne... suhlasim... lenze ako si napisal, nebude vidno kurzor... takze ak sa budes chciet pohybovat sipkami medzi pismenami, ktore si napisal, budes v haji... a co teraz? o tomto probleme viem... preto stale pisem o rieseni, ze input type=text musi byt nad neviditelnym input type=file... len sa snazim najst riesenie ako manualne napisany subor napchat do toho input type=file... to ze nevidno kurzor to je problem... potrebujem take riesenie, ktoreho spravanie je totozne s jedinym input type=file... len s vlastnym buttonom...
Do input type=file nijako inak text nenacpeš, lebo by to bola bezpečnostná diera. Takže zostáva buď sa zmieriť s tým, že nie je vidno kurzor alebo že to bude nenaštýlované (to je tá lepšia voľba).
Ak nevidno kurzor - je to v haji... to uz potom radsej disable nad intput type=text, ktory sa nachadza nad input type=file... lenze taketo riesenie nie je dobre...
hmmm... no? zeby bol neriesitelny problem oznaceny ako vyrieseny?
Ak by som chcel naozaj iný výzor za prijateľnú cenu, tak by mi neviditeľný kurzor v input type=file nevadil, pretože si neviem predstaviť, že by to tam niekto písal ručne. Písanie by nebolo úplne vyradené, takže by to bolo ešte akceptovateľné. Lepšie riešenie naštýlovania input type=file asi neexistuje.
Nesuhlasim... predstav si, ze mas v adresari 10000 XML-iek ocislovanych file0001.xml - file9999.xml...
chces vybrat subor "file5217.xml"... co je lepsie? vybrat s okna dany subor, alebo ho manualne napisat? Viem, ze musim importovat "file5217.xml"... osobne pre mna by bolo lepsie to napisat... a nie len pre mna... toto je uplne realna situacia, ktora sa stane... preto potrebujem aj manualne pisanie...
edit: je sice pravda, ze nazov suboru mozes napisat aj v dialogovom okne pre vyber suboru, ale poziadavka je, ze sa to musi dat napisat aj priamo v input texte...
To, že si neviem predstaviť, že by to tam niekto písal ručne, neznamená, že to tam ručne napísať nejde (hoci ja by som to ani v tomto prípade ručne nepísal, pretože vždy je to ľahšie vybrať v tom okne).
Poznáš plusy a mínusy naštýlovania input type=file, výber toho, čo použiješ, je už len na tebe.
Dobre... takze s tymto som uz skoncil... este jedna otazka ma napadla... dal by sa do toho buttonu dat nejaky iny nazov? "Browse..." --> "Vyber..." predpokladam, ze to nepojde... asi to bude zavisle od jazyka IE, ale pre istotu sa pytam...
Zmeniť text tlačidla nejde.