javascript 从和到 startDate 的日期选择器不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17872120/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 09:55:29  来源:igfitidea点击:

Datepicker from and to startDate not working

javascriptjquerydatepicker

提问by timmy

Date pick "from" and "to" work for the first time, but when I change the date "from", the date "to" is not working.

日期选择“从”和“到”第一次工作,但是当我更改“从”日期时,“到”日期不起作用。

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>

HTML

HTML

<th>From: <input type="text" class="from span2" value="" id="from"></th>
<th>To: <input type="text" class="to span2" value="" id="to"></th>

Script

脚本

var from = $('.from').datepicker({autoclose: true}).on('changeDate', function(e){           

    $('.to').datepicker({autoclose: true, startDate: e.date })

});      

Here's my code http://jsfiddle.net/britonet/VS2zS/2/First try it works perfect, I choose FROM = 07/03/2013, and Date TO disabled 07/02/2013, 07/01/2013.. and so on... but again if i change date FROM = 06/10/2013, it did not disabled Date TO

这是我的代码http://jsfiddle.net/britonet/VS2zS/2/首先尝试它完美无缺,我选择 FROM = 07/03/2013,和 Date TO disabled 07/02/2013, 07/01/2013..依此类推...但如果我再次更改日期 FROM = 06/10/2013,它并没有禁用 Date TO

回答by Nils

The problem is that the $('.to').datepickeris not initialized. JSFIDDLEis very simple fiddle to set fromand todate ranges.

问题是$('.to').datepicker未初始化。 JSFIDDLE是一个非常简单的小提琴,用于设置日期范围。

Updating for new :

更新新的:

Following code sets new start date :

以下代码设置新的开始日期:

var from = $('.from').datepicker({ autoclose: true }).on('changeDate', function(e){
$('.to').datepicker({ autoclose: true}).datepicker('setStartDate', e.date).focus();
});

FIDDLE.

小提琴。

回答by da-hype

your .toshould be outside your onchange. something like this,

你的.to应该在你的 onchange 之外。像这样的东西,

var from = $('.from').datepicker({autoclose: true}).on('changeDate', function(e){           

});    

var to $('.to').datepicker({autoclose: true, startDate: e.date });

here is working code. the code will set the starDateto todays date. and the endDatewill start a day after startDate. If startDate is changed, it will dynamically change the enddate, this way users can't select a date before startDate

这是工作代码。该代码将starDate设置为今天的日期。并且endDate在 startDate 之后的一天开始。如果 startDate 改变了,它会动态改变 enddate,这样用户就不能选择 startDate 之前的日期

the HTML:

HTML:

From: <input type="text" class="from span2" value="" id="from"></th>
To: <input type="text" class="to span2" value="" id="to">

The JQuery:

JQuery:

var _startDate = new Date(); //todays date
var _endDate = new Date(_startDate.getTime() + (24 * 60 * 60 * 1000)); //plus 1 day
$('#from').datepicker({
  format: 'mm/dd/yyyy',
  autoclose: true,
  startDate: _startDate,
  todayHighlight: true
}).on('changeDate', function(e){
    _endDate = new Date(e.date.getTime() + (24 * 60 * 60 * 1000)); //get new end date
    $('#to').datepicker('setStartDate', _endDate).focus(); //dynamically set new start date for #to
    });

$('#to').datepicker({
  format: 'mm/dd/yyyy',
  autoclose: true,
  startDate: _endDate,
  todayHighlight: false
});

HERE IS THE FIDDLE

这是小提琴

For more information on Eternicode's bootstrap datepicker, click here

有关Eternicode 的引导程序日期选择器的更多信息,请单击此处

回答by Raidri supports Monica

You need to initialize both datepickers and change the start date for the second one after picking a date in the first one:

您需要初始化两个日期选择器并在选择第一个日期后更改第二个日期选择器的开始日期:

var to = $('.to').datepicker({ autoclose: true });
var from = $('.from').datepicker({ autoclose: true }).on('changeDate', function(e){
    to.startDate = e.date;
});