PDA

View Full Version : Date Picker doesn't work



BeeJay
02-18-2018, 10:07 AM
Hi everyone,
I'm an absolute newbie to Bootstrap and I'm trying to get what is supposed to be a simple date picker in a simple html page by copying the code from an site for of working examples. .
I've downloaded the necessary Bootstrap .js and .css files, checked that the links to them are correct, and then copied and pasted the example code into the page. I do get the box with the calendar icon on the end but when I click in the box or on the icon nothing happens. Can you help please?

Here's what I copied:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Calendar Test</title>

<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="../css/bootstrap.css" type="text/css">
<link rel="stylesheet" href="../css/bootstrap-theme.css" type="text/css">
</head>
<body>

<h1 class="bg-primary">Hello, world!</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<br><br>
<span class="alert-info">This is my own text</span>...<br class="carousel-inner">
<br><br>
<div class="container">
<div class="row">
<div class='col-sm-2'>
<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>
<script type="text/javascript">
$(function () {
$('#datetimepicker1').datetimepicker();
});
</script>
</div>
</div>
</body>
</html>