twitter-bootstrap Bootstrap Datepicker - 从内联/嵌入式版本中选择日期
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19095783/
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
Bootstrap Datepicker - selecting date from inline/embedded version
提问by Optimaximal
Can someone explain how to capture the selected date from the inline/embedded version of Eternicode's extended Bootstrape Datepicker - http://eternicode.github.io/bootstrap-datepicker/
有人可以解释如何从 Eternicode 的扩展 Bootstrape Datepicker 的内嵌/嵌入式版本中捕获选定的日期 - http://eternicode.github.io/bootstrap-datepicker/
<form class="form-date" role="form" action="/'.$ref.'/edit" method="get">
<div class="form-group" id="datepickid">
<div></div>
<input type="hidden" name="dt_due" id="dt_due">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
...
$('#datepickid div').datepicker({
startDate: "+1d",
todayHighlight: true
});
As I'm sure is clear, I want it to write to the hidden input when the date selected changes.
正如我确定的那样，我希望它在选择的日期更改时写入隐藏的输入。
I'm sure i'm missing something obvious, but the other examples write to the input it is linked too, but there seems to be no obvious way the data is output from the inline version.
我确定我遗漏了一些明显的东西，但其他示例也写入了它链接的输入，但似乎没有明显的方式从内联版本输出数据。
All help appreciated.
所有帮助表示赞赏。
回答by Optimaximal
Nevermind, the answer was given via a Google Group.
没关系，答案是通过 Google Group 给出的。
I had to add .on(ChangeDate)...
我不得不添加 .on(ChangeDate) ...
$('#datepickid div').datepicker({
startDate: "+1d",
todayHighlight: true
}).on('changeDate', function(e){
$('#dt_due').val(e.format('dd/mm/yyyy'))
});
回答by Sean F
You can also use this to get all dates (for multidate)
您还可以使用它来获取所有日期（对于多日期）
$('#datepickid div').datepicker({
startDate: "+1d",
todayHighlight: true
}).on('changeDate', function(e){
$('#dt_due').val(
$('#datepickid div').datepicker('getFormattedDate') // get the formatted date from the datepicker (using the format you instantiated it with)
);
});
回答by Ellington Brambila
Recently I am working in a project that needs to implement some pages using datepicker for more user usability, more specific Bootstrap 3 DatePicker, particulary I think is the best framework I ever found on the internet. While I was developing, I found the same problem you describe, but how I don't know what specific framework you are using, I am describing my solution and my code. Initially, the framework in question is the Bootstrap 3 Datepicker. This answer may not be useful to some users using another frameworks, different from this.
最近我在做一个项目，需要使用 datepicker 实现一些页面以获得更多用户可用性，更具体的 Bootstrap 3 DatePicker，特别是我认为是我在互联网上找到的最好的框架。在我开发的时候，我发现了你描述的同样的问题，但是我不知道你使用的是什么特定的框架，我正在描述我的解决方案和我的代码。最初，有问题的框架是Bootstrap 3 Datepicker。这个答案对于使用其他框架的一些用户可能没有用，与此不同。
My HTML code:
我的 HTML 代码：
<div class="form-group form-group-md" align="left">
<label for="inputDataInicial" class="col-form-label">Data Inicial:</label>
<div class="inputDataInicial" name="inputDataInicial" id="inputDataInicial"></div>
</div>
To initialize the datepicker:
初始化日期选择器：
$("#inputDataInicial").datetimepicker({
format: 'DD/MM/YYYY',
locale: 'pt-br',
useCurrent: true,
inline: true,
sideBySide: true
}).on('dp.change', function(e){
$('.inputDataInicial').val(e.date.format('YYYYMMDD'));
});
Next, I set the default date using the momentframework - Bootstrap 3 Datepicker uses it:
接下来，我使用moment框架设置默认日期- Bootstrap 3 Datepicker 使用它：
var currentDate = moment().format('YYYYMMDD');
$('.inputDataInicial').val(currentDate);
$('.inputDataFinal').val(currentDate);
Finally, I implemented a simple button to get the selected date:
最后，我实现了一个简单的按钮来获取所选日期：
$(".btn_relatorio_amap_gerar").unbind("click").on("click",function(e) {
var data_inicial = $(".inputDataInicial").val() + ' 00:00:00';
var data_final = $(".inputDataFinal").val() + ' 23:59:59';
alert(data_inicial + ' - ' + data_final);
});
The result:
结果：
I hope that helps you.
我希望这对你有帮助。
