Boostrap日期选择器未在每个更改事件上更新

时间:2015-06-30 07:01:25

标签: javascript php jquery

我正在尝试更改从日期选择的日期。但它并没有对每次更改进行更新,只是第一次工作。

这是我的代码

<div class="control-group">
<label class="control-label wth-auto" for="txt_from_date">From<span class="star">*</span></label>
<div class="controls">
    <div class="input-append date dp1" data-date-format="yyyy-mm-dd" data-date="">
        <input class="span5 lms_datepicker" data-date-format="yyyy-mm-dd" name="txt_from_date"  readonly="" value="<?php echo date('d/m/Y') ?>" placeholder="<?php echo date('d/m/Y') ?>" size="26" type="text" id="txt_from_date">
        <span class="add-on">
            <i class="icon-calendar"></i>
        </span>
    </div>
    <div class="input-append date lms_datepicker" data-date-format="yyyy-mm-dd" data-date="">
        <input class="span5 lms_datepicker" data-date-format="yyyy-mm-dd" name="txt_to_date"  readonly="" value="<?php echo date('d/m/Y') ?>" placeholder="<?php echo date('d/m/Y') ?>" size="26" type="text" id="txt_to_date">
        <span class="add-on">
            <i class="icon-calendar"></i>
        </span>
    </div>

</div>

$('.lms_datepicker').datepicker({});
$("#txt_from_date").on("changeDate", function(e) {
 var nowDate = new Date($(this).val());
 var now = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);
 $('#txt_to_date').datepicker('remove');
 $("#txt_to_date").datepicker({
        onRender:  function(date) {
            return date.valueOf() < now.valueOf() ? 'disabled old' : '';
        } });
  });

请说明错误的地方。

提前致谢。

1 个答案:

答案 0 :(得分:0)

您不能通过这种方式创建datepicker,只会创建一个datepicker对象,您需要遍历这些类并为每个DOM对象创建一个datepicker,然后使用datepicker setDate函数来设置所需的日期选择DOM对象的datepicker:

          $('.lms_datepicker').each(function(){
                $(this).datepicker();
            });

            $("#txt_from_date").on("change", function(e) {

             var nowDate = new Date($(this).val());
             var now = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);
             $('#txt_to_date').datepicker("setDate",now);

       // <<<<<<<<<<<<<<<<<<<<<<<<<<<<< let it start form the date chosen in 
       //from all previous dates will be disabled 
       $('#txt_to_date').datepicker( "option", "minDate", nowDate);

        // <<<<<<<<<<<<<<<<<<<<<< Edit - disable the from datepicker
        $(this).datepicker( "option", "disabled", true );

            });