Code Here:
<h5 class="card-title">Default Material Date Picker</h5>
<div class="form-group border-bottom pb-3">
<input type="text" class="form-control" placeholder="2017-06-04" id="mdate">
</div>
<h5 class="card-title">Default Material Date Picker</h5>
<div class="form-group border-bottom pb-3">
<input class="form-control" id="timepicker" placeholder="Check time">
</div>
Init Code
$('#mdate').bootstrapMaterialDatePicker({ weekStart: 0, time: false });
$('#timepicker').bootstrapMaterialDatePicker({ format: 'HH:mm', time: true, date: false });
Required Files For Nouislider Here
<!-- CSS Here -->
<link rel="stylesheet" type="text/css" href="../package/assets/libs/bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker.css">
<!-- Javascript Here -->
<script src="../package/assets/libs/moment/moment.js"></script>
<script src="../package/assets/libs/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker-custom.js"></script>