Inicio -› jQuery -› Datedropper

Datedropper

Datedropper es un plugin jQuery para disponer un formato más atractivo de obtener o seleccionar una fecha (datepicker) en un campo de texto en tus formularios.

Es un plugin muy liviano que se instala en 3 segundos.

En la cabecera de tu página tan solo debes añadir la hoja de estilos, la librería jQuery, el plugin y la llamada, como por ejemplo:

<link rel="stylesheet" type="text/css" href="datedropper.css"> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="datedropper.js"></script>
<script>
$(document).ready(function(){
    $("#from").dateDropper();
});
</script>

En el cuerpo de la página <body> allí donde tengas tu formulario debes añadir el input que abrirá el calendario:

<input type="text" name="from" id="from" />

 

Obteniendo como resultado:

datedropper

Este plugin se puede personalizar un poco con diversas funciones como:

  • Cambiar el tipo de animación al abrir el selector
  • Cambiar el formato de la fecha
  • Cambiar el idioma
  • Establecer un año máximo
  • Establecer un año mínimo
  • Establecer un rango de años
  • Etc.

Y además es posible cambiar el aspecto o estilo. Hay unos cuantos disponibles en la página oficial del plugin.

Lo mejor del plugin es que en dispositivos pequeños como el móvil funciona perfectamente. Es Responsive Design.

Ver ejemplo en funcionamiento

Descargar Datedropper

1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (1 votos, promedio: 1,00 de 5)
Cargando…

Comparte en las redes sociales

Escrito por Jose Aguilar - Experto programador Prestashop y Wordpress.

3 comentarios para “Datedropper”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*