Datepicker Bootstrap

Membuat datepicker dengan bootstrap

by Fikriansyah Chan

HTML

<link rel="stylesheet" href="https://dl.dropboxusercontent.com/s/jft0fuopho3ja29/datepicker.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://dl.dropbox.com/s/zo3zygr6bjp20gl/jquery-1.10.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://dl.dropbox.com/s/oj3oma1h10d5fbx/bootstrap-datepicker.js"></script>

<center><H1>Membuat DatePicker Dengan Bootstrap</H1></center>

<div class="row">
    <div class="col-xs-7 col-xs-offset-3 col-sm-5 col-sm-offset-5 col-lg-5 col-lg-offset-5">
    <div class="form-group" >
        <div class="col-md-6">
        	<div class="datepicker-center">
	            <div class="input-group date " data-date="" data-date-format="yyyy-mm-dd">
								                <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
	                <input class="form-control" type="text" name="tgl_regis" readonly="readonly">

	            </div>
            </div>
        </div>
    </div>
    </div>
    <!-- /.col-lg-6 -->
</div>
<!-- /.row -->

<center><h3>More Tutorial on <a href="https://www.tutorialpedia.net">TutorialPedia.NET</a></h3></center>

JavaScript

$(".input-group.date").datepicker({autoclose: true, todayHighlight: true});