BLOG DE DISEÑO WEB CORUÑA

Un poco de todo, recursos, tutoriales, noticias, anuncios...

Pickadate un selector de fechas responsive con jQuery

22/MAR/2013 8.661 visitas Ver comentarios
Pickadate un selector de fechas responsive con jQuery

ADVERTENCIA: Este artículo tiene más de 6 meses de antigüedad. Puede que esta información ya se encuentre obsoleta o haya nuevas y mejores opciones.

A menudo debemos hacer formularios web donde le solicitamos al usuario que ingrese una fecha. Hasta aquí no hay problema, pero el tema se complica cuando necesitamos que el usuario nos marque una determinada fecha, en un formato específico, o cualquier variante que se nos pueda presentar.

Lo normal sería, si estás usando el framework de jQuery UI, usar su datepicker, pero si no lo estás usando, cargar todos los js, css e imágenes se hace un tanto pesado, incluso, personalizar su apariencia, requiere que crees un tema o te adaptes a lo que trae.

Pero qué pasa si le agregamos la dificultad de necesitar que nuestro calendario selector sea adaptativo? Y qué pasa si necesitamos configurarle opciones como desactivar fechas, que en el UI no es tan sencillo?

Si tu caso es alguno de éstos, Pickadate ha llegado para resolverte la vida. Realmente me he llevado una muy buena impresión en unas demos que hice y lo fácil que parece de utilizar.

De sobra está decir que es 100% personalizable mediante un CSS no tan cargado como el de jQuery UI (y si quitamos todas las sombras con los prefijos delante, reduciremos considerablemente el CSS). Incluso, va más allá y trae algunos temas ya creados que seguramente se adapten a tus necesidades.

Para verlo funcionar, no tienes más que hacer click en el botón enorme que está más arriba y para descargarlo puedes dirigirte a este enlace.

Debes tener en cuenta que el soporte de los Internet Explorer, empieza en el 7 y necesita un JS extra que es el Legacy (te lo descargas de la misma web).

Qué tiene de bueno
El autor nos promete que está trabajando en una nueva versión que incluirá un selector de hora y resolverá cualquier bug que tenga la versión actual.

Qué opino...
Que si no quieres usar jQuery UI y necesitas un selector de fecha bonito, debes darle una oportunidad... ya que tiene cosas muy buenas como, por ejemplo, poder enmascarar lo que ves en el input y lo que realmente mandas al hacer un submit (ejemplo: ver la fecha en español y mandarla en formato inglés), desactivar fines de semana, días concretos, seleccionar entre rango de fechas, modificar el primer día de la semana, etc...

Código 1 - JAVASCRIPT
$('.datepicker').pickadate()

Acerca del Autor...

Macadia, es una agencia de Diseño Web Coruña, especializada en maquetación css y desarrollo de páginas web a medida con más de 21 años de experiencia en el desarrollo de páginas web profesionales. Si te ha gustado este artículo, por favor, ayúdanos a difundirlo compartiéndolo con tus amigos y contactos en las distintas redes sociales que utilices. ¡Muchas gracias!

Los comentarios han sido desactivados momentaneamente a la espera de que Disqus adapte su plataforma a la próxima RGPD que entra en vigor desde el 25/05/2018