Change/Edit onSelect event of an active jQuery Datepicker

Question

If another code displays datepicker like this:

$('#my-datepicker').datepicker({
    onSelect: function(dateText, inst) { 
    // console.log()
}
});

and I was wondering to add another event when the datepicker is selected, how will I do this?

UPDATE: I can get the instance of the datepicker like this:

var id = document.getElementById('my-datepicker'); 
var inst = window.$.datepicker._getInst(id);

Answer 1

You can ovveride simply the call by using the option on the onSelect function property :

$( "#my-datepicker" ).datepicker("option", "onSelect", function() {
    // do some stuff 
    console.log(" another event");
});

See below snippet :

 jQuery(function($) { $("#my-datepicker").datepicker({ onSelect: function(dateText) { console.log(" default event"); } }); $( "#my-datepicker" ).datepicker("option", "onSelect", function() { console.log(" another event"); }); }); 

 <link href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" /> <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <input type='text' id='my-datepicker'>