Bootstrap 3 daterange

by Nibin George

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<div class="form-group">
    <label class="control-label col-md-3">Date Range</label>
    <div class="col-sm-9">
        <div class="input-daterange" id="datepicker">
            <div class="input-group">
                <input type="text" class="input-small form-control" name="start" placeholder="Start Date" /> <span class="input-group-addon">to</span>

                <input type="text" class="input-small form-control" name="end" placeholder="End Date" />
            </div>
        </div>
    </div>
</div>

CSS

@import url('http://getbootstrap.com/dist/css/bootstrap.css');
 @import url('http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker.css');

JavaScript

$('.input-daterange').datepicker({
    orientation: "top",
});