カスタムボタンからJQueryのdatepicker hide（）を呼び出すと、IEでカレンダーが再度開きます

Question

JQueryダイアログには、Jqueryの日付ピッカーに関連付けられた2つのテキストボックスがあり、日付範囲を受け入れるために使用されます。

「保存」というJqueryの日付ピッカーにカスタムボタンを追加しました。問題は、ボタンをクリックすると、そのボタンに関連付けられた機能が実行されますが、カレンダーは開いたままです。カレンダーを閉じるには、日付ピッカーの外の領域をクリックする必要があります。 これを修正するにはどうすればよいですか？これはIEでのみ見られます。 FFで正常に動作します。

var startDateTextBox = $('#StartDate'); 
var endDateTextBox = $('#EndDate'); 

これは私のカスタム関数です：

function addSaveButton(textBoxObject) 
    { 
     //These variables can be ignored. Used to set limits for the other datepicker 
     var idTextBox = textBoxObject.attr('id'); 
     var otherTextBoxObject = idTextBox == "StartDate" ? endDateTextBox : startDateTextBox; 
     var optionName = idTextBox == "StartDate" ? "minDate" : "maxDate"; 

     setTimeout(function() 
     { 
      var buttonPane = textBoxObject 
           .datepicker("widget") 
           .find(".ui-datepicker-buttonpane"); 

      $("<button>", { 
       text: "Save", 
       click: function() 
       { 
        //Get the date 
        var dateToBeSet = getDateToSet(idTextBox); 

        //Set the date 
        textBoxObject.datepicker('setDate', dateToBeSet); 

        //Set the limits for the other date picker 
        otherTextBoxObject.datepicker("option", optionName, dateToBeSet); 

        //Hide this datepicker 
        textBoxObject.datepicker("hide"); 

        //Remove focus 
        textBoxObject.blur(); 
       } 
      }).appendTo(buttonPane).addClass(".ui-datepicker-buttonpane ui-state-default ui-priority-primary ui-corner-all"); 
     }, 1); 
    } 

これは、テキストボックスの1のために私のDatePickerのコードです：

startDateTextBox.datepicker({ 
     autoSize: true, 
     closeText: "OK", 
     showButtonPanel: true, 
     constrainInput: true, 
     showWeek: true, 
     maxDate: "+0", 
     dateFormat: 'd MM yy', 
     changeMonth: true, 
     changeYear: true, 

     beforeShow: function (input, inst) 
     { 
      addSaveButton(startDateTextBox); 
     }, 

     onChangeMonthYear: function (year, month, inst) 
     { 
      addSaveButton(startDateTextBox); 
     }, 

     onSelect: function (dateText, inst) 
     { 
      //Set the limits for the other date picker 
      instance = startDateTextBox.data("datepicker"); 
      date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, 
            dateText, 
            instance.settings); 

      endDateTextBox.datepicker("option", "minDate", date); 
     }, 

     onClose: function (dateText, inst) 
     { 
      //Remove focus 
      startDateTextBox.blur(); 
     } 
    }); 

Answer 1

私は簡単に無効にする機能addSaveButton(textBoxObject)て、コメントを追加し、コードを更新データピッカーと関連付けられた入力テキストボックスとそれが機能しました。

function addSaveButton(textBoxObject) 
    { 
     ... 

     setTimeout(function() 
     { 
      var buttonPane = textBoxObject 
           .datepicker("widget") 
           .find(".ui-datepicker-buttonpane"); 

      $("<button>", { 
       text: "Save", 
       click: function() 
       { 
        . 
        . 
        . 

        //Remove focus 
        textBoxObject.blur(); 

        //Disable textbox 
        textBoxObject.attr("disabled", "disabled"); 

        setTimeout(function() 
        { 
         // Removed the 'disabled' attribute after 1 millisecond 
         textBoxObject.removeAttr("disabled"); 
        }, 1); 

       } 
      }).appendTo(buttonPane).addClass(".ui-datepicker-buttonpane ui-state-default ui-priority-primary ui-corner-all"); 
     }, 1); 
    }