Lim Guang Jian Lim Guang Jian - 8 months ago 55
Javascript Question

Jquery UI datepicker change button

Hello I have a button here and when click it shows the calendar:

enter image description here

enter image description here

What I want to achieve is that when a date is picked, the button text and image will be replace by e.g. 22-07-2016, so far no luck with changing it.

<input name="depart" id="depart">

$( "#depart" ).datepicker({
defaultDate: null,
dateFormat: "dd-mm-yy",
showOn: "button",
buttonText: "<span class='glyphicon glyphicon-calendar'></span>Depart<span class='glyphicon glyphicon-menu-down'></span>",

I have tried a variety of methods such:

onSelect: function(date) {
buttonText: date,


You would have to set the value of the option using option. Try,

onSelect: function(date) {
    $(this).datepicker('option', 'buttonText', date);