multilingual calendar date picker - Free Download Basic Multilingual Calendar & Date Picker Plugin For jQuery

Free Download Basic Multilingual Calendar & Date Picker Plugin For jQuery

Posted on

This time I will share jQuery Plugin and tutorial about Basic Multilingual Calendar & Date Picker Plugin For jQuery, hope it will help you in programming stack.

multilingual calendar date picker - Free Download Basic Multilingual Calendar & Date Picker Plugin For jQuery
File Size: 9.15 KB
Views Total: 9214
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

A small jQuery plugin to create a basic yet customizable calendar widget where you can customize the month names and trigger an event when a date is selected.

How to use it:

1. Load the calendar plugin’s JavaScript and CSS files in the HTML document. Make sure you also add the latest jQuery JavaScript library.

2         integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
3         crossorigin="anonymous">
4 </script>
5 <script src="jquery.calendar.js"></script>
6 <link rel="stylesheet" href="jquery.calendar.css">

2. Call the function on document ready to generate a default calendar inside a container you specify.

1 <div id="example">
2    
3 </div>
1 $(function () {
2   $('#example').calendar();
3 });

3. Localize the month names.

1 $(function () {
2   $('#example').calendar({
3     months: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
4   });
5 });

4. Localize the names of the days of the week.

1 $(function () {
2   $('#example').calendar({
3     days: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
4   });
5 });

5. Customize the primary color of the calendar.

1 $(function () {
2   $('#example').calendar({
3     color: '#ff0000'
4   });
5 });

6. Get the slected date using the onSelect callback.

1 $(function () {
2   $('#example').calendar({
3     onSelect: function (event) {
4       $('.output').text(event.label);
5     }
6   });
7 });

Changelog:

2020-01-15

  • Fixed don’t understand 2020 year and month if page refresh

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

source : jquery.net