标签: bootstrap-datepicker
使用bootstrap-datepicker检测对所选日期的更改
我有一个输入元素,其中包含使用bootstrap-datepicker创建的附加日期选择器.
<div class="well">
<div class="input-append date" id="dp3" data-date="2012-01-02" data-date-format="yyyy-mm-dd">
<input type="text" id="date-daily">
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
$('#dp3').datepicker();
$('#date-daily').val('0000-00-00');
$('#date-daily').change(function () {
console.log($('#date-daily').val());
});
});
</script>
当用户通过直接输入input元素来更改日期时,我可以使用input元素的onChange事件获取值,如上所示.但是当用户从datepicker更改日期时(即通过单击日历上的日期),不会调用onChange处理程序.
如何检测通过日期选择器创建的所选日期的更改,而不是通过键入输入元素？
推荐指数
解决办法
查看次数
如何让bootstrap-datepicker与Bootstrap 3一起使用？
我使用由eternicode(Andrew Rowls)维护的bootstrap- datepicker版本.
在Bootstrap 2上它工作,但现在它不能与Bootstrap 3库一起使用.
我怎样才能获得自举日期选择器一起工作Bootstrap 3？
注意:存储库从eternicode移动到组织帐户(uxsolutions).
datepicker twitter-bootstrap twitter-bootstrap-3 bootstrap-datepicker
推荐指数
解决办法
查看次数
Twitter Bootstrap日期选择器
我如何使用Twitter Bootstrap日期选择器？我使用下面的代码,但它不起作用.
<html>
<head>
<title>DatePicker Demo</title>
<script src="js/jquery-1.7.1.js"></script>
<link href="css/datepicker.less" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="js/bootstrap-datepicker.js"></script>
</script>
</head>
<body>
<form >
<div class="input">
<input class="small" type="text" value="01/05/2011" data-datepicker="datepicker">
</div>
</form>
</body>
</html>
推荐指数
解决办法
查看次数
如何限制Bootstrap Datepicker中的可选日期范围？
我需要使用datepicker,它为我提供了限制可选日期的选项.我们一直在使用jQuery UI,它使用minDate,maxDate选项来支持它.
$("#id_date").datepicker({minDate: +1, maxDate: '+1M +10D'});
最近我们开始使用Twitter Bootstrap作为我们的风格.显然,Twitter Bootstrap与jQuery UI样式不兼容.所以我尝试使用http://www.eyecon.ro/bootstrap-datepicker/上提供的bootstrap兼容日期选择器之一.
不幸的是,上面的插件不像jQuery UI的datepicker那样可配置.任何人都可以帮助我限制新的datepicker中的可选日期范围.
javascript datepicker twitter-bootstrap bootstrap-datepicker
推荐指数
解决办法
查看次数
bootstrap datepicker setDate format dd/mm/yyyy
我必须以dd/mm/yyyy格式在我的datepicker中设置日期.我正在尝试做,用Javascript是这样的:
var year = 2014;
var month = 5;
var day = 10;
var realDate = new Date(year, month - 1, day); // months are 0-based!
$('#MainContent_txtDataConsegna').datepicker({ dateFormat: 'dd/mm/yyyy' }); // format to show
$('#MainContent_txtDataConsegna').datepicker('setDate', realDate);
问题是我的datepicker里面的值总是格式为mm/dd/yyyy.问题出在哪儿？？
这里定义了datepicker和datepicker选项:
<div class="input-group date">
<asp:TextBox runat="server" ID="txtDataOrdine" class="form-control" onBlur="CalcolaTotaliTestata('txtDataOrdine')"></asp:TextBox>
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i>/span>
</div>
<script type="text/javascript">
$('.input-group.date').datepicker({
todayBtn: "linked",
language: "it",
autoclose: true,
todayHighlight: true,
dateFormat: 'dd/mm/yyyy'
});
</script>
推荐指数
解决办法
查看次数
Bootstrap datepicker方向/位置
我有一个文本字段,在页面底部放置了一个附加的日期选择器.我的问题是,datepicker出现在文本字段下方.
因此,它出现在窗外.我用谷歌搜索,发现显然我可以通过一些orientation属性解决这个问题:
$('#dp2').datepicker({
orientation: 'auto top'
});
但这没有效果.任何人都知道如何实现这一目标？
推荐指数
解决办法
查看次数
关于bootstrap datepicker的粘性问题
我在网站上使用bootstrap datepicker,它也通过给它的父级固定位置设置为粘性,它正常工作但在Ipad和Iphone上测试它(尚未在andriod设备上测试),当我向下滚动时尝试触摸日期选择器打开它,它滚动回到页面顶部,我该如何解决这个问题？
当我使用自定义下拉列Selectric时出现类似的问题
我创建了这个问题的一个简单的条纹下来的版本在这里.请注意,问题不会在模拟器上复制,而是在实际的移动设备或ipad上复制.
推荐指数
解决办法
查看次数
手动编辑日期或清除日期时,bootstrap datepicker更改日期事件不会启动
<script type="text/javascript">
// When the document is ready
$(document).ready(function () {
$('.datepicker').datepicker({
format: "yyyy-mm-dd",
}).on('changeDate', function(ev){
// do what you want here
$(this).datepicker('hide');
}).on('changeDate', function(ev){
if ($('#startdate').val() != '' && $('#enddate').val() != ''){
$('#period').text(diffInDays() + ' d.');
} else {
$('#period').text("-");
}
});
});
</script>
所以这就是我的日期选择器的样子.所以基本上当我通过点击鼠标更改日期时它工作正常,但是当我用键盘手动更改日期或手动清除日期更改日期时,事件不会被调用.这是一个错误还是我在这里做错了什么？
javascript jquery datepicker twitter-bootstrap bootstrap-datepicker
推荐指数
解决办法
查看次数
将bootstrap-datepicker限制为仅限工作日？
无论如何只允许在下面找到的引导日期选择器中选择工作日选项吗？ https://github.com/eternicode/bootstrap-datepicker/
我正在实例化这样的日期选择器:
$('#datepicker').datepicker();
/* Update datepicker plugin so that MM/DD/YYYY format is used. */
$.extend($.fn.datepicker.defaults, {
parse: function (string) {
var matches;
if ((matches = string.match(/^(\d{2,2})\/(\d{2,2})\/(\d{4,4})$/))) {
return new Date(matches[3], matches[1] - 1, matches[2]);
} else {
return null;
}
},
format: function (date) {
var
month = (date.getMonth() + 1).toString(),
dom = date.getDate().toString();
if (month.length === 1) {
month = "0" + month;
}
if (dom.length === 1) {
dom = "0" + dom;
}
return month + …推荐指数
解决办法
查看次数
如何从未来日期限制引导日期选择器
我想限制bootstrap的日期选择器从未来的日期开始.我只想启用日期到今天.我怎么能实现这一点.
这是我的代码
<script>
var FromEndDate = new Date();
$(function(){
$('.datepicker').datepicker({
format: 'mm-dd-yyyy',
endDate: FromEndDate,
autoclose: true
});
});
</script>
任何人都可以帮忙解决这个问题
推荐指数
解决办法
查看次数