jquery datepicker沒有彈出第一次點擊，但彈出第二次點擊

Question

我面臨jQuery日期選擇器的問題。

我將jquery datepicker附加到一個javascript函數中動態生成的文本框。

問題是日期選擇器不會在第一次點擊時彈出，如果我在javascript函數中放置斷點或警報，那麼在第一次點擊自動時彈出日期選擇器。

這是JavaScript函數，我使用：

function CalendarPopUpOnClick(TextBoxId, HiddenFieldId) { 
    if (TextBoxId != undefined) { 
     $('#' + serverIdPrefix + TextBoxId).keypress(function (event) { 
      event.preventDefault(); 
     }); 
     var dateTimeDueDate = $('#' + serverIdPrefix + HiddenFieldId).val(); 
     var dateTimeArrDueDate = dateTimeDueDate.split(" "); 
     var dateOnlyDueDate = dateTimeArrDueDate[0]; 
     $('#' + serverIdPrefix + TextBoxId).val(dateOnlyDueDate); 

     setTimeSpanBeginInput = function() { 
      var dateTime = $('#' + serverIdPrefix + HiddenFieldId).val(); 
      var dateTimeArr = dateTime.split(" "); 
      var dateOnly = dateTimeArr[0]; 
      $('#' + serverIdPrefix + TextBoxId).val(dateOnly); 
     } 
     $('#' + serverIdPrefix + TextBoxId).datepicker({ 
      dateFormat: 'yy-mm-dd', 
      onSelect: function (dateText) { 
       $('#' + serverIdPrefix + HiddenFieldId).val(dateText + ' 12:00:00 PM'); 
      }, 
      onClose: setTimeSpanBeginInput 
     }); 
    } 
} 

Answer 1

謝謝大家，

對不起，我遲到更新。

我已經得到這與下面的代碼工作。

我正在使用C＃和Asp.Net作爲@adeneo指出的。

我創建從C＃代碼兩個動態文本框後面添加JavaScript函數onclik文本框的事件下面給出：

DeliveryDateTextBox.Attributes.Add("onClick", "javascript:CalendarPopUpOnClick('" + DeliveryDateTextBox.ClientID + "','" + Hiddenfield_DeliveryDateTextBox.ClientID + "');"); 


DueDateTextBox.Attributes.Add("onClick", "javascript:CalendarPopUpOnClick('" + DueDateTextBox.ClientID + "','" + Hiddenfield_DueDateTextBox.ClientID + "');"); 

，並在JavaScript文件我加入以下代碼：

$(document).ready(function() 
{ 
/* Get id prefixes for checkboxes, checkbox control elements */ 
var exampleId = $("input[use='proprietary']").attr("id"); 
var serverIdPrefixEndPos = exampleId.indexOf("exampleID"); 
serverIdPrefix = exampleId.substring(0,serverIdPrefixEndPos); 

/* Datepicker BEGIN */ 
setTimeSpanBeginInput = function(){ 
           var dateTime = $('#'+ serverIdPrefix +'timeSpanFromDeliveryDateHiddenField').val(); 
           var dateTimeArr = dateTime.split(" "); 
           var dateOnly = dateTimeArr[0]; 
           $('#'+ serverIdPrefix +'timeSpanFromDeliveryDate').val(dateOnly); 
          } //when calendar closed, copy hidden field value to main date field 
$('#'+ serverIdPrefix +'timeSpanFromDeliveryDate').datepicker({dateFormat: 'yy-mm-dd', onSelect: function(dateText){ $('#'+ serverIdPrefix +'timeSpanFromDeliveryDateHiddenField').val(dateText + ' 12:00:00 PM'); }, onClose: setTimeSpanBeginInput}); 

setTimeSpanEndInput = function(){ 
           var dateTime = $('#'+ serverIdPrefix +'timeSpanToDateHiddenField').val(); 
           var dateTimeArr = dateTime.split(" "); 
           var dateOnly = dateTimeArr[0]; 
           $('#'+ serverIdPrefix +'timeSpanToDeliveryDate').val(dateOnly); 
          } //when calendar closed, copy hidden field value to main date field 
$('#'+ serverIdPrefix +'timeSpanToDeliveryDate').datepicker({dateFormat: 'yy-mm-dd', onSelect: function(dateText){ $('#'+ serverIdPrefix +'timeSpanToDateHiddenField').val(dateText + ' 12:00:00 PM'); }, onClose: setTimeSpanEndInput}); 

/* Datepicker END */ 



});//end document ready 
function CalendarPopUpOnClick(TextBoxId, HiddenFieldId) 
{ 

    if (TextBoxId) { 
     var textBox  = $('#' + serverIdPrefix + TextBoxId), 
      hiddenField = $('#' + serverIdPrefix + HiddenFieldId); 

     textBox.focus(); 

     $(":input").bind('paste', function(e) { 
     setTimeout(function() { 
     var dateval =hiddenField.val(); 
       if(dateval.indexOf('0001-01-01')==-1) 
       textBox.val( hiddenField.val().split(" ")[0] ); 
       else 
       textBox.val(''); 
     }, 100); 
     });    

     textBox.keypress(function(event) {event.preventDefault();}); 
     hiddenField.keypress(function(event) {event.preventDefault();}); 
     var dateTime = hiddenField.val(); 
     var dateTimeArr = dateTime.split(" "); 
     var dateOnly = dateTimeArr[0]; 
     textBox.datepicker({ 
      dateFormat: 'yy-mm-dd', 
      onSelect: function (dateOnly) { 
       hiddenField.val(dateOnly + ' 12:00:00 PM'); 
      }, 
      onClose: function() { 
       var dateval =hiddenField.val(); 
       if(dateval.indexOf('0001-01-01')==-1) 
       textBox.val( hiddenField.val().split(" ")[0] ); 
      } 
     }); 
     textBox.datepicker().datepicker('show'); 
    } 
}