Skip to content

Instantly share code, notes, and snippets.



Created Apr 6, 2015
What would you like to do?
Hacking datepicker to get notification of any change to the underlying date object
<!doctype html>
<html lang="en">
<meta charset="utf-8">
<title>jQuery UI Datepicker - Select on every date change</title>
<link rel="stylesheet" href="" />
<script src=""></script>
<script src=""></script>
$(function() {
$( "#datepicker" ).datepicker();
$('#datepicker').datepicker("option", "onSelect", function(dateStr, inst) {
if (inst.input.val() !== "" && inst.input.val() !== inst._lastUpdate) {
inst._lastUpdate = dateStr;
var previousUpdate = $.datepicker._updateDatepicker;
var _update = function(inst) {
var dateStr = $.datepicker._formatDate(inst);
var onSelect = $.datepicker._get(inst, "onSelect");
if (onSelect) {
// trigger custom callback
onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]);
previousUpdate.apply($.datepicker, [inst]);
$.datepicker._updateDatepicker = _update;
<p>Date: <input type="text" id="datepicker"></p>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment