Simple calendar jQuery plugin

1. Introduction

simpleCalendar is a simple jQuery calendar plugin that can be used as a date picker on an HTML form or to present events. The plugin provides many customization options and can be easily integrated with any website.

2. Plugin Overview

Library	simpleCalendar
Author	Brospars
Licence	MIT Licence
Repository	GitHub
Dependencies	jQuery 1.3.1 or Latest version

Demo

3. How to install and use simpleCalendar jQuery plugin

Follow below steps to install simpleCalendar jQuery plugin.

1. Include a recent version of jQuery and all simpleCalendar CSS and JS files into your website:

<!--jQuery js-->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<!--Google Fonts-->
<link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>

<!--Simple Cale Calender CSS-->
<link rel="stylesheet" href="css/simple-calendar.css">

<!--Simple Calender Js-->
<script src="js/jquery.simple-calendar.js"></script>

2. Inside `$(document).ready();` jQuery function call `simpleCalendar` like in the following example:

$(document).ready(function(){
    $("#container").simpleCalendar();
});

Below more advanced initialization:

$(document).ready(function(){
    $("#container").simpleCalendar({
        //Defaults options below
        //string of months starting from january
        months: ['january','february','march','april','may','june','july','august','september','october','november','december'],
        days: ['sunday','monday','tuesday','wednesday','thursday','friday','saturday'], //string of days starting from sunday
        minDate : "YYYY-MM-DD",         // minimum date
        maxDate : "YYYY-MM-DD",         // maximum date
        insertEvent: true,              // can insert events
        displayEvent: true,             // display existing event
        fixedStartDay: true,            // Week begin always by monday
        event: [],                      // List of events
        insertCallback : function(){}   // Callback when an event is added to the calendar
    });
});

simpleCalendar plugin after initialization will attach calendar panel to selected #container.

4. Conclusion

In this article, we presented simpleCalendar jQuery plugin designed to present a calendar with an event management system. The plugin can be used in the form as a date picker or event picker.