Revisando los diseños de formularios que últimamente pasan por mis manos no está de más revisitar las técnicas que nos permiten "poner bonito un input file".
Las más populares son la clásic de shaun inman, y una elaborada por Michael McGrady (según PPK). Por mi parte estoy mucho más de acuerdo esta última, aunque creo que si la vamos a usar varias veces en un proyecto necesitamos que sea un poquito más flexible.
He escrito un plugin pequeñito que hace el trabajo sucio y nos permite centrarnos en estilizar el input file falso y no en todo lo demás. Depende de jquery porque la mayoría del tiempo trabajo con este framework, pero sería fácil dejarlo limpio de dependencias.
Por el momento funciona, echadle un vistazo a la demo :)
El código fuente lo podéis encontrar en su correspondiente repositorio en github..















vieron 1 dic 2009 - 09:21 AM
chulisisisimo!
ala_747 1 dic 2009 - 09:27 AM
Está buenísimo!! Gracias por compartirlo :)
Lo he probado en FF 3 y 3.5, IE6, 7 y 8, Chrome (y Safari de Win) y Op 9 y va de fábula. Lo único raro lo hace con, cómo no, los IEs en los q, en lugar de meter el filename en el 1er y 3er ejemplos, está metiendo el path real (en IE6: C:\saraza\xxxx.xxx) o uno ficticio (en IE8: C:\fakepath\xxxxxx.xxx).
Pero funcionar funciona igual y eso es una nimiedad (q intentaré mirar, a ver si puedo solucionarlo). Me encanta, de verdad.
No sé cuántas posibilidades tendré de usarlo en mi curro real, pero si eso te avisaré para q lo veas!
Gracias!!
boton 1 dic 2009 - 04:20 PM
Esta cremita el plugin, después de cotillear el código, me surge una duda, perdona mi ignorancia y mi atrevimiento pero no se que hace el final de esta linea.
options = jQuery.extend(defaults, opts || {});
El $.extend(array1, array2) lo tengo claro, pero me pierde el || {} si me das alguna pista aprendo algo hoy, si no disfrutare de tu plugin igual :)
Muchas gracias.
mamuso 3 dic 2009 - 09:13 PM
@vieron, @ala_747 gracias salaos!
@boton gracias, el || {} es por si opts viene undefined. Funciona igual si no se lo pones en este caso, pero ya sabes, te acostumbras a estas cosas y después te salen solas :).