var meses = ["Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul", "Ago", "Sep", "Oct", "Nov", "Dic"]; $("#fecha").datepicker({ onClose: function(date){ var picker = date.split("/"), fecha = $("input[name=fecha]"), day, month, year; $(".day.active").html(picker[1]); $(".month.active").html(meses[picker[0]-1]); $(".year.active").html(picker[2]); day = $(".day.active").html() + "/"; month = $(".month.active").html() + "/"; year = $(".year.active").html(); fecha.val(day + month + year); } });
<div id="datepicker"> <div> <span class="day">3</span> <span class="day active">4</span> <span class="day">5</span> </div> <div> <span class="month">May</span> <span class="month active">Jun</span> <span class="month">Jul</span> </div> <div> <span class="year">2013</span> <span class="year active">2014</span> <span class="year">2015</span> </div> </div> <input type="text" id="fecha" placeholder="Elige una fecha" /> <input type="text" name="fecha" readOnly>