md.bootstrappersiandatetimepicker
Version:
Persian Date Time Picker with jQuery 3+ & Bootstrap 4+
56 lines (48 loc) • 2.24 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8" />
<title>MD Persian DateTime To Debug</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<link rel="stylesheet" href="demo.css" />
<link rel="stylesheet" href="../src/jquery.md.bootstrap.datetimepicker.style.css" />
</head>
<body>
<div class="container">
<h2>Simple</h2>
<div class="row">
<div class="col-sm-6">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text cursor-pointer" id="dt_class">Icon</span>
</div>
<input type="text" id="inputDate3" class="form-control" value="2019-09-22">
</div>
<label id="showDate_class"> </label>
</div>
</div>
</div>
<script src="../src/jquery.md.bootstrap.datetimepicker.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#dt_class").MdPersianDateTimePicker({
targetDateSelector: "#inputDate3",
targetTextSelector: "#showDate_class",
textFormat: " dddd dd MMMM yyyy ",
isGregorian: false
});
});
</script>
<br><br>
</body>
</html>