twitter-bootstrap datetimepicker 组件不在正确的位置
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28293960/
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
datetimepicker component not in right place
提问by dede
I want to use datetimepicker from bootstrap so I follow manual installing guides in this site bootstrap-datetimepickerbut I've got following error:
我想从 bootstrap 使用 datetimepicker，所以我按照本站点bootstrap-datetimepicker 中的手动安装指南进行操作， 但出现以下错误：
Uncaught Error: datetimepicker component should be placed within a relative positioned container.
未捕获的错误：datetimepicker 组件应放置在相对定位的容器中。
How to solve it?
如何解决？
<div class="control-group form-horizontal ">
<label class="control-label">Date</label>
<div class="controls">
<input name="datetime" id="datetimepicker4" type="text" class="span4" value="<?php echo $datetime; ?>">
</div>
</div>
<script type="text/javascript">
$(function() {
$('#datetimepicker4').datetimepicker();
});
</script>
Thank your for your responses...
感谢您的回复...
回答by tire0011
You need a container div around of the controls
您需要一个围绕控件的容器 div
<body>
<div class="container">
<div class="row">
<div class="col-md-6">
your code snippet here
</div>
</div>
</div>
</body>
回答by Andemki
I had the same issue and my workaround was add new class for my datetime control and selector for it with position: relativeattribute:
我遇到了同样的问题，我的解决方法是为我的日期时间控件和选择器添加新类，并使用position: relative属性：
<style>
.editor-datetime {
position: relative;
}
</style>
<div class="editor-datetime">
@Html.EditorFor(i => i.StartDate)
</div>
Hope this helps!
希望这可以帮助！
回答by Mayas
I had the same issue too.
我也有同样的问题。
I fixed it by adding a position relative to the wrapping div, like so:
我通过添加相对于包装 div 的位置来修复它，如下所示：
<div class="control-group form-horizontal ">
<label class="control-label">Date</label>
<div class="controls" style="position: relative">
<input name="datetime" id="datetimepicker4" type="text" class="span4" value="<?php echo $datetime; ?>" >
</div>
</div>
<script type="text/javascript">
$(function () {
$('#datetimepicker4').datetimepicker();
});
</script>
回答by juliocesar
You are using bootstrap2, try to use other datetimepicker that have bootstrap2 support i.e. http://tarruda.github.io/bootstrap-datetimepicker/, it seems http://eonasdan.github.io/bootstrap-datetimepicker/is only for bootstrap3.
您正在使用 bootstrap2，尝试使用其他支持 bootstrap2 的 datetimepicker，即http://tarruda.github.io/bootstrap-datetimepicker/，看来http://eonasdan.github.io/bootstrap-datetimepicker/仅适用于 bootstrap3 .
