title: Datepicker hide calender to show month-year and full calendar not working properly
body: <p>I have two fields in my form, one displays a datepicker to show only month and year, and other show full calendar.</p>
  
  <pre><code>From &lt;input type="text" name="startdate" id="datepicker"/&gt;
  To &lt;input type="text" name="enddate" id="datepicker1"/&gt;
  </code></pre>
  
  <p>The javascript is :</p>
  
  <pre><code>$('#datepicker').datepicker( {
      changeMonth: true,
      changeYear: true,
      showButtonPanel: true,
      dateFormat: 'mm-yy',
      onChangeMonthYear: function(year, month, widget) {
          $('.ui-datepicker-calendar').hide();
      },
      onClose: function(dateText, inst) { 
          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));
      },
  }).click(function(){
      $('.ui-datepicker-calendar').hide();
  });
  
  $('#datepicker1').datepicker( {
      changeMonth: true,
      changeYear: true, 
      dateFormat: 'dd/mm/yy',
  }).click(function(){
      $('.ui-datepicker-calendar').show();
  });
  </code></pre>
  
  <p>Upto this, the both calendar works fine. But when we change the month or year for the first calendar, the full calendar displays ! I tried adding hide calendar in<code>onChangeMonthYear</code> but not working !</p>
  
  <p><a href="http://jsfiddle.net/4HxsF/5/" rel="nofollow">JS Fiddle link</a></p>