jQuery UI datepicker onChangeMonthYear and the inst parameter

Question

$('.selector').datepicker({
   onChangeMonthYear: function(year, month, inst) { ... }
});

How can I use the 'inst' parameter of onChangeMonthYear to auto-select the first day of the month?

see: http://jsfiddle.net/sD8rL/

I am currently using the code below but I feel like I should be able to use the 'inst' variable in a more straight-forward way.

   $(".datepicker" ).datepicker({
      changeMonth: true,
      changeYear: true,
      maxDate:0,
      onChangeMonthYear: function(year, month, inst){
        // set date to 1st on year or month change

        // this seems  bit janky, but works
        $('#' + inst.id).datepicker( "setDate", month + '/1/' + year );

        // Can't I use the instatnce to set the date?

        // $(inst).datepicker( "setDate", month + '/1/' + year ); // fails
        // inst.datepicker( "setDate", month + '/1/' + year ); // fails
        // inst.selectedDay = 1; // fails
        // inst.currentDay = 1; // fails 
      }
  });

Answer 1

If there is no particular reason that you want to use inst, you can always use this:

  onChangeMonthYear: function(year, month, inst){
     $(this).datepicker( "setDate", month + '/1/' + year );
  }

See it in action: http://jsfiddle.net/william/sD8rL/2/.

Answer 2

Solution by William Niu doesn't consider other date formats (such as dd-mm-yyyy). You'd better get a Date object from your datepicker and modify it the way you like (i.e., setting the first day of the month). After your modifications, you can re-pass the modified Date object to your datepicker.

    dateFormat: "dd-mm-yy",
    onChangeMonthYear: function(year, month, inst){
      var selectedDate = $(this).datepicker( "getDate" );//Date object
      selectedDate.setDate(1);//set first day of the month
      selectedDate.setMonth(month-1);//month is 1-12, setMonth is 0-11
      selectedDate.setFullYear(year);
      $(this).datepicker( "setDate", selectedDate );
   }

This way you won't overwrite date format (possibly set during datepicker initialization) ;)

Pay attention to the month format: datepicker handles a 1-12 format for months, while the Date object is 0-11.

Hope this can help, bye!