Superior Nepali Date Picker In jQuery

A straightforward superior jQuery date picker for Nepali that helps each single date choice and date vary (multi-date) choice.

Find out how to use it:

1. Load the wanted stylesheet nepali-date-picker.css within the doc.

<hyperlink rel="stylesheet" href="nepali-date-picker.css" />

2. Create a standard textual content enter on the web page.

<enter sort="textual content" class="date-picker" placeholder="Choose Date(s)">

3. Load jQuery library and the JavaScript nepali-date-picker.js on the backside of the web page.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/nepali-date-picker.js"></script>

4. Connect the Nepali Date Picker to the enter area. That is it.

$(operate(){
  $('.date-picker').nepaliDatePicker();
});

5. To create a single date picker, simply add the data-single="true" attribute to the enter area.

<enter sort="textual content" class="date-picker" data-single="true" placeholder="Choose Date(s)">

6. It’s also possible to outline the preliminary date or date vary within the worth attribute as follows:

<enter sort="textual content" class="date-picker" worth="2075-5-12" identify="date1" />
<enter sort="textual content" class="date-picker" worth="2076-12-11,2076-12-12,2076-12-13" identify="date2" />

7. Present all chosen dates as a substitute of ‘x dates chosen’ utilizing the data-show_all_dates attribute.

<enter sort="textual content" class="date-picker" worth="2076-12-11,2076-12-12,2076-12-13" identify="date2" data-show_all_dates="true" />

8. Config the beginning/finish dates.

var start_year = 2000;
var end_year = 2098;

Changelog:

2024-10-29

• Set off Change Occasion on Date Choice in Single Datepicker

v2.2 (2024-06-19)

v2.1 (2021-03-29)

• UI enhancements
• Higher assist for yyyy-mm-dd date format

2021-03-20

2020-04-25

2020-04-23

This superior jQuery plugin is developed by sonill. For extra Superior Usages, please examine the demo web page or go to the official web site.