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
Datepicker from and to startDate not working
提问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').datepicker
is 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();
});
回答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
});
For more information on Eternicode's bootstrap datepicker, click here
回答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;
});