dnCalendar

simple and light calendar built with jquery

Requirements

• JQuery 1.*

Browser supported

• Safari (tested)
• Google Chrome (tested)
• Firefox (tested)
• Safari mobile (tested)
• Google Chrome mobile (tested)

Usage

load style and jquery first, then load dncalendar.js or dncalendar.min.js bellow jquery

Simple Usage

$("#dncalendar-container").dnCalendar().build(); 

Update or re-draw Calendar

var myCalendar = $("#dncalendar-container").dnCalendar(); // build first myCalendar.build();  // update and change calendar myCalendar.update({defaultDate: "2015-12-04"}) 

Callback

$("#dncalendar-container").dnCalendar({ 	dayClick: function(date, view) {     	alert(date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear());     } }).build(); 

Set Min and Max Date

$("#dncalendar-container").dnCalendar({ 	minDate: "2015-12-15", 	maxDate: "2016-03-01", }).build(); 

Set default date

$("#dncalendar-container").dnCalendar({ 	defaultDate: "2016-01-12" }).build(); 

Change Month and Day name

$("#dncalendar-container").dnCalendar({ 	monthNames: [ "Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember" ],  	dayNames: [ 'Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'] }).build(); 

Change Month and Day short name

$("#dncalendar-container").dnCalendar({ 	monthNamesShort: [ 'Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun', 'Jul', 'Agu', 'Sep', 'Okt', 'Nov', 'Des' ], 	dayNamesShort: [ 'Min', 'Sen', 'Sel', 'Rab', 'Kam', 'Jum', 'Sab' ] }).build(); 

Use short name

$("#dncalendar-container").dnCalendar({ 	dayUseShortName: true,     monthUseShortName: true }).build(); 

Change title of default date and today

$("#dncalendar-container").dnCalendar({ 	dataTitles: { defaultDate: 'default', today : 'hari ini' } }).build(); 

Add some notes in Calendar

$("#dncalendar-container").dnCalendar({ 	notes: [     		{ "date": "2015-12-25", "note": ["Natal"] },     		{ "date": "2015-12-31", "note": ["Tahun Baru"] }     	] }).build(); 

Show information detail of notes

$("#dncalendar-container").dnCalendar({ 	showNotes: true }).build(); 

Set start day of week

// ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"] $("#dncalendar-container").dnCalendar({ 	startWeek: 'sunday' // default is sunday }).build(); 

Copyright

Copyright (C) 2015 Romdoni Agung Purbayanto ( donnydiunindra AT gmail.com )