Easy Jalali Date Picker Plugin With jQuery

File Size: 12.9 KB
Views Total: 7539
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Easy Jalali Date Picker Plugin With jQuery

A simple, convenient jQuery date picker plugin that works with Persian(Jalali) calendar, without any 3rd JavaScript libraries. Supports custom date format and date/month/year calendar views.

See also:

How to use it:

1. Include jQuery JavaScript library and the Datepicker Jalali plugin's script and CSS files on your webpage.

<link rel="stylesheet" href="datepicker.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="datepicker.js"></script>

2. Create a container element for the calendar from which you can select the date by click.

<div class="calender"></div>

3. Create a text field to accept the date input.

<input type="text" id="calenderSelector">
<input type="text" id="calenderSecondarySelector">

4. Call the function with some options to activate the date picker.

  altField : "#calenderSelector",
  altSecondaryField : "#calenderSecondarySelector",
  format : "long"

5. Customize the Jalali calendar & date picker using the following options.


  // min/max dates
  minDate  : null,
  maxDate  : null,

  // min/max years
  maxYear  : 1420,
  minYear  : 1320,

  // right/left arrows
  navRight : "<",
  navLeft  : ">",

  // shows today
  today    : true,

  // or 'long'
  format   : "short",

  // or 'month', 'year'
  view : "day",

  // initial date
  date : "1991-01-02",

  // true or false
  gregorian: false

Change log:


  • secondary field , view , pick , select color , and some fixes


  • Gregorian option added

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