Line 32: | Line 32: | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</style> | </style> | ||
+ | <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> | ||
+ | <!-- Isolated Version of Bootstrap, not needed if your site already uses Bootstrap --> | ||
+ | <link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" /> | ||
+ | |||
+ | <!-- Bootstrap Date-Picker Plugin --> | ||
+ | <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script> | ||
+ | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/> | ||
<div id="page-top" data-spy="scroll" data-target=".navbar-fixed-top"> | <div id="page-top" data-spy="scroll" data-target=".navbar-fixed-top"> | ||
Line 130: | Line 95: | ||
<!-- About Section --> | <!-- About Section --> | ||
+ | <div class="bootstrap-iso"> | ||
+ | <div class="container-fluid"> | ||
+ | <div class="row"> | ||
+ | <div class="col-md-6 col-sm-6 col-xs-12"> | ||
+ | <!-- Form code begins --> | ||
+ | <form method="post"> | ||
+ | <div class="form-group"> <!-- Date input --> | ||
+ | <label class="control-label" for="date">Date</label> | ||
+ | <input class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/> | ||
+ | </div> | ||
+ | <div class="form-group"> <!-- Submit button --> | ||
+ | <button class="btn btn-primary " name="submit" type="submit">Submit</button> | ||
+ | </div> | ||
+ | </form> | ||
+ | <!-- Form code ends --> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
+ | </div> | ||
Line 144: | Line 129: | ||
<!---TEST---> | <!---TEST---> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<!---TEST--> | <!---TEST--> | ||
</section> | </section> | ||
− | + | <script> | |
+ | $(document).ready(function(){ | ||
+ | var date_input=$('input[name="date"]'); //our date input has the name "date" | ||
+ | var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body"; | ||
+ | var options={ | ||
+ | format: 'mm/dd/yyyy', | ||
+ | container: container, | ||
+ | todayHighlight: true, | ||
+ | autoclose: true, | ||
+ | }; | ||
+ | date_input.datepicker(options); | ||
+ | }) | ||
+ | </script> | ||
</html> | </html> | ||
{{BOKU-Vienna-footer}} | {{BOKU-Vienna-footer}} |
Revision as of 13:30, 11 July 2017