Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Listening to onChange on a jQuery datepicker?

Tags:

I currently am creating a date picker like so

HTML

<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> <input id="datepicker" type="datepicker" name="date" placeholder="Date" /> 

JS

$('#datepicker').datepicker()     .on("change", function (e) {     console.log("Date changed: ", e.target.value); }); 

My goal is to be able to listen for when the user clears out the date box. However, the change event only seems to fire once you unfocus the date box. I'm wondering if there's a way to listen for all changes in a jQuery date box, or if there are any better alternatives.

JsFiddle link: https://jsfiddle.net/szkfm0y7/

like image 586
John Pizzo Avatar asked May 08 '15 20:05

John Pizzo


People also ask

How do I use Onchange in DatePicker?

To work with jQuery Datepicker onchange(), use the datepicker onSelect event. This will show which date we added currently and changed to.

What is Kendo DatePicker?

The Kendo UI for Angular DatePicker combines the Kendo UI DateInput and Calendar components. It enables the user to enter or pick a date value. The DatePicker Component is part of Kendo UI for Angular, a professional grade UI library with 100+ components for building modern and feature-rich applications.

What is DatePicker in JavaScript?

The JavaScript DatePicker (Calendar Picker) is a lightweight and mobile-friendly control that allows end users to enter or select a date value. It has month, year, and decade view options to quickly navigate to the desired date.


1 Answers

Use jquery on input alongside with the on change event

$('#datepicker').datepicker()     .on("input change", function (e) {     console.log("Date changed: ", e.target.value); }); 

Fiddle

like image 158
Robin Carlo Catacutan Avatar answered Oct 04 '22 22:10

Robin Carlo Catacutan