I am trying to repeat example from datepicker documenation on jsfiddle
I have wrote the following html code:
<div class="container">
<div class="row">
<div class='col-sm-6'>
<div class="form-group">
<div class='input-group date' id='datetimepicker1'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</div>
</div>
and following js:
$(function () {
$('#datetimepicker1').datetimepicker();
});
but when I start it I see simple input:
What did I forget ?
P.S. I wrote following html but it doesn't work
<html>
<head>
<link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/build/css/bootstrap-datetimepicker.css"
rel="stylesheet">
<script src='//code.jquery.com/jquery-2.1.4.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js'></script>
<script src='//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/src/js/bootstrap-datetimepicker.js'></script>
<script type="text/javascript">
//Настройка выборок для времени
$(document).ready(function () {
$('#startDateDiv').datetimepicker({
format: 'LT'
});
});
</script>
</head>
<body>
<div class="row-fluid main-content chose" style="padding: 20px 0 67px 0;">
<form:form commandName="campaignBeanDto" id="addParams" method="POST">
<div class="param-line">
<div id="startDateDiv" class="input-append date add-params-date-div">
<fmt:formatDate pattern='dd/MM/yyyy' type='date' value='${campaign.beginDate}' var="beginDate"/>
<form:input path="beginDate" id="startDate" name="beginDate"
data-format="dd/MM/yyyy" type="text" />
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i>
</span>
</div>
</div>
</form:form>
</div>
</body>
</html>
I don't see any errors in console but I see simple input
You forgot to include bootstrap.css and moment.js files,
here is the working fiddle.