Datepicker Bootstrap does not work

1

I have a Datepicker bootstrap, but when I click the button next to the text box, that calendar does not appear.

I thought it might be some missing link or script, but I always just find the datepicker code without the links it needs to do.

Follow the darn:

<!DOCTYPE html>
<html lang="utf-8">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
        <link rel="stylesheet" href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css" />
        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script><scripttype="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script><scripttype="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script><scripttype="text/javascript" src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script><title>PSA-Formações</title><linkhref="css/bootstrap.min.css" rel="stylesheet">
    <style>
    body {

        background-color: #dcdcdc;
    }
    </style>
</head>

<body>

    <!-- content -->
    <div class="container">

        <div class="row">
            <div class="col-lg-12 text-center">
                <h1 style="
                    margin-top:100px;">Cadastro de Turmas</h1>
                <p> </p>
                <p class="lead"></p>
                <ul class="list-unstyled">
                    <form id="cadastro" name="cadastro" method="post" action="banco/updateT.php">

                       <!-- Olha ele aqui -->

                        <div class="container">
                        <div class="row">
                            <div class='col-sm-12'>
                                <div class="form-group">
                                    <div class='input-group date' id='datetimepicker1'>
                                        <label>Data:</label>
                                        <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> 
    <!-- /.container -->
    </div>

    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>

</body>
</html>
    
asked by anonymous 29.09.2017 / 15:02

1 answer

3

Do a debug by the browser press F12 tab console to check if you have any javascript error, because, I just generated a test and it worked, but at the end of that HTML has two javascript that I can not test, observe the minimal example running:

$(function() {
  $('#datetimepicker1').datetimepicker();
});
<link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css" />
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script><scripttype="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script><scripttype="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script><scripttype="text/javascript" src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script><divclass="container">
  <div class="row">
    <div class="col-lg-12 text-center">
      <h1 style="
                    margin-top:100px;">Cadastro de Turmas</h1>
      <p> </p>
      <p class="lead"></p>
      <ul class="list-unstyled">
        <form id="cadastro" name="cadastro" method="post" action="banco/updateT.php">

          <!-- Olha ele aqui -->

          <div class="container">
            <div class="row">
              <div class='col-sm-12'>
                <div class="form-group">
                  <div class='input-group date' id='datetimepicker1'>
                    <label>Data:</label>
                    <input type='text' data-date-format="DD-MM-YYYY" 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>
          <!-- /.container -->

If you still want to format the date, just go to the input and put a paramparent ( data-date-format="DD-MM-YYYY" ), example :

<input type='text' data-date-format="DD-MM-YYYY" class="form-control" />
    
29.09.2017 / 15:31