Question

我有一个弹出窗口，其中包含来自datepicker的jQuery。我无法选择结束日期值。

jQuery调用

$(function() {
  $("#createdFromDate").datepicker(
    {
      defaultDate : "+1w",
      changeMonth : true,
      numberOfMonths : 1,
      changeMonth : true,
      changeYear : true,
      onClose :
        function(selectedDate) {
          $("#createdToDate").datepicker(
            "option", "minDate", selectedDate
          );
        }
    }
  );
  $("#createdToDate").datepicker(
    {
      defaultDate : "+1w",
      changeMonth : true,
      numberOfMonths : 1,
      changeMonth : true,
      changeYear : true,
      onClose :
        function(selectedDate) {
          $("#createdFromDate").datepicker("option","maxDate",selectedDate);
        }
    }
  );
});

$("#filterPopUp").dialog(
  {
    autoOpen : false,
    modal : true,
    height : 'auto',
    width : '70%'
  }
);

$(document).on('click', ".getTimeFeed",
  function() {
    $('#filterPopUp').dialog("open");
  }
);

这是我的JSP页面。

<div id="filterPopUp" class="filterPopUp" title="Custom Time">
  <div class="col-sm-3 no-padding">
    <label class="control-label col-sm-6 col-xs-12" for="createdFromDate">
      Start Date: </label>
    <div class="col-xs-5 col-md-6 no-padding input-max controls">
      <input type="text" class="form-control  input-sm" name="createdFromDate"
             id="createdFromDate">
    </div>
  </div>
  <div class="col-sm-3 no-padding"> 
    <label class="control-label col-sm-6 col-xs-12" for="createdToDate">
      End Date: </label> 
    <div class="col-xs-5 col-md-6 no-padding input-max controls">
      <input type="text" class="form-control  input-sm" name="createdToDate" id="createdToDate">
    </div>
  </div>
  <div id="actions" class="actions">
    <button type="button" id="feedFilterCancel" class="btn cancel-btn">
      <i class="icon-remove"></i>
      <fmt:message key="button.cancel" />
    </button>
    <button type="button" id="timeFilter" class="btn btn-primary">
      <i class="icon-ok icon-white"></i>
      <fmt:message key="button.save" />
    </button>
  </div>
</div>

当我选择结束日期时出现弹出窗口时，它不接受它。

Answer 1

您可以使用此结构：

$(function(){
    $("#createdToDate").datepicker();
})

Answer 2

请尝试使用此代码：这是您的要求的简单HTML方法。

$("#filterPopUp").dialog({
    autoOpen: false,
    modal: true,
    height: 'auto',
    width: '70%'
});
$("#filterPopUp").on("dialogopen", function (event, ui) {
    $("#createdFromDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        changeYear: true,
        onClose: function (selectedDate) {
            $("#createdToDate").datepicker(
                "option", "minDate", selectedDate);
        }
    });
    $("#createdToDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        changeYear: true,
        onClose: function (selectedDate) {
            $("#createdFromDate").datepicker("option", "maxDate", selectedDate);
        }
    });

});
$(document).on('click', ".getTimeFeed",
  function() {
    $('#filterPopUp').dialog("open");
  }
);

这对我来说很好。您可以在以下位置查看：http://jsfiddle.net/ravimallya/euwpD/1/

jquery datepicker从不在弹出窗口中工作

2 个答案: