[英]Input text doesn't work with bootstrap datepicker
I am using angular.js and bootstrap datepicker to obtain dates. 我正在使用angular.js和bootstrap datepicker获取日期。
This is my code in HTML: 这是我的HTML代码:
<div class="form-group col-sm-6 col-md-6 col-lg-6">
<label for="employee_contract_start" class="req">Inicio de Contrato</label>
<input type="text" data-parsley-trigger="change" class="form-control data_input" id="employee_contract_start" ng-model="employee.contract_start" value="" required>
</div>
... and JS ...和JS
$("#employee_contract_start").datepicker({
format: 'dd/mm/yyyy',
autoclose: true,
todayHighlight: true
}).on('show', function(){
if($(this).val() == '') {
$(this).val('14/10/2014').datepicker('update');
}
});
Now, let's me explain: 现在,让我解释一下:
When I see (or recharge, whatever) the page, the input appears in blank and the date just appears when I click the input. 当我看到页面(或为页面充值)时,输入将显示为空白,而日期则仅在单击输入时显示。 I would like that the date "14/10/2014" appears without I have to click the input.
我希望日期“ 14/10/2014”出现,而无需单击输入。
I can't upload images yet to explain better :P 我尚无法上传图片以更好地解释:P
Thanks!!! 谢谢!!!
What I understand correctly is that you want to set default date as todays date 我正确理解的是您要将默认日期设置为今天的日期
To do that, you will have to set the date to todays date explicitly like this 为此,您必须像这样明确地将日期设置为今天的日期
$("#employee_contract_start").datepicker({
format: 'dd/mm/yyyy',
autoclose: true,
todayHighlight: true
}).on('show', function(){
if($(this).val() == '') {
$(this).val('14/10/2014').datepicker('update');
}
});
// Now once you have initilized datepicker, you can set the initial date like this---
var currentDate = new Date(); // Here get today's date
$("#employee_contract_start").datepicker("setDate", currentDate); // set default date to be todays date
$('#employee_contract_start').val(currentDate)
I am not going to answer your question directly, however, recently I had a chance to work with bootstrap's datepicker
, and there were lots of issues with it, especially when trying to integrate it with some Angular logic. 我不会直接回答您的问题,但是,最近我有机会使用bootstrap的
datepicker
,并且存在很多问题,尤其是在尝试将其与某些Angular逻辑集成时。
Then, I discovered - angular-bootstrap : "Bootstrap components written in pure AngularJS by the AngularUI Team" , and it simplified working with Datepicker a lot! 然后,我发现-angular -bootstrap : “由AngularUI团队使用纯AngularJS编写的Bootstrap组件” ,它大大简化了使用Datepicker的工作! Check the
Datepicker
section in the provided link. 在提供的链接中检查“
Datepicker
部分。 The source code is provided directly below examples. 源代码直接在示例下方提供。
Hope you will find using it more intuitive and fitting with the rest of your Angular app. 希望您会发现使用它更加直观,并且可以与Angular应用程序的其余部分配合使用。
如果您希望在加载页面时显示当前日期,则需要在加载日期选择器之后手动初始化日期选择器。
Well, i represent ADMdtp
module. 好吧,我代表
ADMdtp
模块。 It's pure AngularJs dateTimePicker with lots of greate options: 它是纯粹的AngularJs dateTimePicker,具有许多出色的选择:
<adm-dtp ng-model="date" full-data="date_full"></adm-dtp>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.