Pretty Persian Date Time Picker with jQuery and Bootstrap

Pretty Persian Date Time Picker with jQuery and Bootstrap
File Size: 738 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

A pretty date & time jQuery plugin which enables you to select Persian(jalali) date from a calendar popup based on Bootstrap popover component.

Dependencies:

See also:

How to use it:

1. Load jQuery JavaScript library and other required resources in the document.

<link href="/path/to/bootstrap.min.css" rel="stylesheet">
  ...
<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/bootstrap.min.js"></script>
<script src="/path/to/jalaali.js"></script>

2. Load the jQuery MD.BootstrapPersianDateTimePicker plugin's JS and CSS files in the document.

<link rel="stylesheet" href="jquery.Bootstrap-PersianDateTimePicker.css">
<script src="jquery.Bootstrap-PersianDateTimePicker.js"></script>

3. Create a normal text input for the date time picker. Plugin's options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-placement="right".

<input id="textbox" type="text" value="۱۳۹۲/۰۱/۰۱"
       data-mddatetimepicker="true"  
       data-placement="right"
>

4. Full plugin options.

EnglishNumber: false,
Placement: 'bottom',
Trigger: 'focus',
EnableTimePicker: true,
TargetSelector: '',
GroupId: '',
ToDate: false,
FromDate: false,
Disabled: false

Change log:

2017-08-12

  • update.

2017-05-13

  • update.

2017-01-16

  • update.

2016-10-30

  • update.

2016-09-23

  • update.

2016-09-17

  • update.

2016-08-14

  • bugfix

2016-05-21

  • bugfix

2016-01-27

  • Add Disabled to settings

This awesome jQuery plugin is developed by Mds92. For more Advanced Usages, please check the demo page or visit the official website.