Traducir al español JQuery UI - Datepicker


En muchos casos agregamos el JQuery Datepicker a nuestros proyectos y no sabemos cómo traducir los textos al español.

Para empezar, debemos tener agregado a nuestro proyecto la librería de JQuery Datepicker (http://jqueryui.com/datepicker/)

En el código HTML debemos crear un campo de texto con la clase mi-fecha (Pueden poner el nombre que deseen a la clase):

<input class="mi-fecha" name="fecha" value="" />

En el código JAVASCRIPT:

//Código para realizar las traducciones:

$(document).ready(function () {
$.datepicker.regional['es'] = {
        closeText: 'Cerrar',
        prevText: '<Ant',
        nextText: 'Sig>',
        currentText: 'Hoy',
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
        dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
        dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Juv', 'Vie', 'Sáb'],
        dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sá'],
        weekHeader: 'Sm',
        dateFormat: 'dd/mm/yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
    $.datepicker.setDefaults($.datepicker.regional['es']);


//Código para indicar que la clase mi-fecha es un datepicker:

$(".mi-fecha").datepicker();
});


Con el ejemplo, obtendremos el calendario traducido al español.