CODEWITHSUNDEEP
jquery-uicalendar
Shyju
Shyju

Reputation: 218792

Get selected date in jqueryui datepicker inline mode

I am trying to use jqueryui datepicker. I want to use the inline mode.

I want to know how can I get the selected date when user selects a date. Where to get and how to get ?

Upvotes: 22

Views: 50529

Answers (3)

Baqer Naqvi
Baqer Naqvi

Reputation: 6514

I was trying to work with close event but it also used to trigger when calendar is open and I click somewhere else on the scree. Eventually calendar loses focus and close event it called. So i found this one;

  onClose: function (dateText, inst) {
            function isDonePressed() {
                return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1);
            }
            if (isDonePressed()) {
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                $(this).datepicker('setDate', new Date(year, month, 1));
            }
        }

Upvotes: 1

Chris Stewart
Chris Stewart

Reputation: 1689

$(document).on("change", "#datepickerdiv", function () {
         alert($(this).val())


    })

This is the simplest answer in Jquery.

Upvotes: 19

Tim Van Laer
Tim Van Laer

Reputation: 2534

You can retrieve the date by using the getDate function:

$("#datepicker").datepicker( 'getDate' );

The value is returned as a JavaScript Date object.

If you want to use this value when the user selects a date, you can use the onSelect event:

$("#datepicker").datepicker({
   onSelect: function(dateText, inst) { 
      var dateAsString = dateText; //the first parameter of this function
      var dateAsObject = $(this).datepicker( 'getDate' ); //the getDate method
   }
});

The first parameter is in this case the selected Date as String. Use parseDate to convert it to a JS Date Object.

See http://docs.jquery.com/UI/Datepicker for the full jQuery UI DatePicker reference.

Upvotes: 65

Related Questions