jQuery Monthpicker un selector de fecha muy sencillo

Descarga : jQueryMonthPicker

jQuery Monthpicker un selector de fecha muy sencillo, permite al usuario seleccionar un año y un mes a partir de una pequeña ventana emergente , ofreciendo una devolución de llamada con la selección del año y del mes, este plugin es relativamente simple, el plugin no contiene documentación alguna, pero en esta nota lo explicamos.

Ejemplo:https://cdn.rawgit.com/lugolabs/monthpicker/master/examples/index.html

Aunque podemos deducir por el ejemplo que se tiene la manera de usarse, también podemos deducir por el código del plugin.

1.- Incluimos la referencia del plugin

  <script src="jquery-1.11.1.js"></script>
  <script src="jquery.monthpicker.js"></script>
  <link rel="stylesheet" type="text/css" href="jquery.monthpicker.css">

2.- incluimos el div donde queremos mostrar la fecha seleccionada.

 <a href="#monthpicker" id="monthpicker"></a>

3.- Por ultimo creamos el script con el código que indica los años deseados.

$(function() {
$('#monthpicker').monthpicker({
years: [2015, 2014, 2013, 2012, 2011],
topOffset: 6,
onMonthSelect: function(m, y) {
console.log('Month: ' + m + ', year: ' + y);
}
});
});

Este selector de fecha sin duda es muy básico, por lo que si quieres es recuperar la información seleccionada tendrás que meterlo en un campo oculto en el método  onMonthSelect.

4.- Agregar los meses en español

$(function() {
$('#monthpicker').monthpicker({
years: [2015, 2014, 2013, 2012, 2011],
months:['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
topOffset: 6,
onMonthSelect: function(m, y) {
console.log('Month: ' + m + ', year: ' + y);
}
});
});

Contenido relacionado: