Migration from Essential JS 1 in JavaScript (ES5) DatePicker control

$("#datepicker").ejDatePicker({  value: new Date("5/5/2014") });

var datepicker = new ej.calendars.DatePicker({ value: new Date("05/11/2017")});
datepicker.appendTo('#datepicker');

$("#datepicker").ejDatePicker({ dateFormat: "dd/MM/yyyy"});

var datepicker = new ej.calendars.DatePicker({
value: new Date("05/11/2017");
format: 'yyyy-MM-dd'});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ dayHeaderFormat: ej.DatePicker.Header.Short});

$("#datepicker").ejDatePicker({ startLevel: ej.DatePicker.Level.Year});

var datepicker = new ej.calendars.DatePicker({
start:'Decade'});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({depthLevel: ej.DatePicker.Level.Year});

var datepicker = new ej.calendars.DatePicker({
depth:'Year'
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({
minDate: new Date("5/1/2013")
});

var datepicker = new ej.calendars.DatePicker({
min: new Date("5/1/2013")
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ maxDate : new Date("5/30/2015")});

var datepicker = new ej.calendars.DatePicker({
max : new Date("5/30/2015")
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({
blackoutDates: [ new Date(2016, 4, 10), new Date(2016, 4, 15), new Date(2016, 4, 20), new Date(2016, 4, 22), new Date(2016, 5, 12), new Date(2016, 5, 24)]
});

var datepicker = new ej.calendars.DatePicker({
renderDayCell: disableDate
});
datepicker.appendTo('#element');
function disableDate(args) {
if (args.date.getDay() === 0 || args.date.getDay() === 6) {
    args.isDisabled = true;  
}
}

$("#datepicker").ejDatePicker({ cssClass: "gradient-lime"});

var datepicker = new ej.calendars.DatePicker({ cssClass: 'e-custom-style'});datepicker.appendTo('#element');

var datepicker = new ej.calendars.DatePicker({
renderDayCell: onRenderCell
});
datepicker.appendTo('#element');

function onRenderCell(args) {/*code block*/}

$("#datepicker").ejDatePicker({ showFooter: false});

var datepicker = new ej.calendars.DatePicker({ showTodayButton: false});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ showOtherMonths: false});

var datepicker = new ej.calendars.DatePicker();
datepicker.appendTo('#element');

.e-datepicker .e-calendar .e-content tr.e-month-hide,.e-datepicker .e-calendar .e-content td.e-other-month > .e-day {
visibility: none;
}
.e-datepicker .e-calendar .e-content td.e-month-hide,.e-datepicker .e-calendar .e-content td.e-other-month {
pointer-events: none;
touch-action: none;
}

$("#datepicker").ejDatePicker({
blackoutDates: [ new Date(2016, 4, 10), new Date(2016, 4, 15), new Date(2016, 4, 20), new Date(2016, 4, 22), new Date(2016, 5, 12), new Date(2016, 5, 24)]
showDisabledRange: false
});

$("#datepicker").ejDatePicker({ showPopupButton: false});

var datepicker = new ej.calendars.DatePicker({
focus: onFocus
});
datepicker.appendTo('#element');
function onFocus(args) {
datepicker.show();
}

.e-control-wrapper .e-input-group-icon.e-date-icon {
display: none;
}

$("#datepicker").ejDatePicker({ showRoundedCorner: true});

var datepicker = new ej.calendars.DatePicker({
cssClass: 'e-custom-style'
});
datepicker.appendTo('#element');

.e-control-wrapper.e-custom-style.e-date-wrapper.e-input-group {
border-radius: 4px;
}

$("#datepicker").ejDatePicker({ stepMonths: 2});

var datepicker = new ej.calendars.DatePicker({
value: new Date("09/04/2018"),
open:onOpen
});
datepicker.appendTo('#element');

function onOpen(args) {
datepicker.navigateTo('Year', new Date("03/18/2018"));
}

$("#datepicker").ejDatePicker({ showTooltip: false});

$("#datepicker").ejDatePicker({ buttonText : "Now"});

L10n.load({  'en': { 'datepicker': {today:'Now' }  }});
var datepicker = new ej.calendars.DatePicker({
locale: 'en'
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ displayInline: true});

$("#datepicker").ejDatePicker({ enableAnimation : false});

$("#datepicker").ejDatePicker({ highlightSection: "week"});

var datepicker = new ej.calendars.DatePicker({
renderDayCell: highlightDate
});
datepicker.appendTo('#element');
function highlightDate(args) {
if (args.date.getDate() === 10) {
  args.element.classList.add('e-highlightweekend');
}
}

.e-highlightweekend {
background-color: #cfe9f3;
}

$("#datepicker").ejDatePicker({ highlightWeekend : true});

var datepicker = new ej.calendars.DatePicker({
renderDayCell: highlightDate
});
datepicker.appendTo('#element');
function highlightDate(args) {
if (args.date.getDay() === 0 || args.date.getDay() === 6) {
  args.element.classList.add('e-highlightweekend');
}
}

.e-highlightweekend {
background-color: #cfe9f3;
}

$("#datepicker").ejDatePicker({ tooltipFormat : "dd/MM/yyyy"});

specialDays = [ { date: new Date(2018, 09, 08), tooltip: "In Australia", iconClass: "flags sprite-Australia" }, { date: new Date(2018, 09, 21), tooltip: "In France", iconClass: "flags sprite-France" }]

$("#datepicker").ejDatePicker({ specialDates: specialDays});

var datepicker = new ej.calendars.DatePicker({
renderDayCell: customDates,
value: new Date('5/5/2017')
});
datepicker.appendTo('#element');
function customDates(args) {
if (args.date.getDate() === 10) {
    var span = document.createElement('span');
    span.setAttribute('class', 'e-icons highlight');   args.element.firstElementChild.setAttribute('title', 'Birthday !');   args.element.setAttribute('title', 'Birthday !');
    args.element.setAttribute('data-val', 'Birthday !');
    args.element.appendChild(span);
}
}

$("#datepicker").ejDatePicker({
focusIn: function (args) {/*code block*/}
});

var datepicker = new ej.calendars.DatePicker({
focus: onFocus
});
datepicker.appendTo('#element');
function onFocus(args){ /*code block*/}

$("#datepicker").ejDatePicker({ focusOut: function (args) { /*code block*/}});

var datepicker = new ej.calendars.DatePicker({
blur: onBlur
});
datepicker.appendTo('#element');
function onBlur(args){ /*code block*/}

var datepicker = new ej.calendars.DatePicker({
placeholder: 'Enter date'
});
datepicker.appendTo('#element');
datepicker.focusIn();

var datepicker = new ej.calendars.DatePicker({
placeholder: 'Enter date'
});
datepicker.appendTo('#element');
datepicker.focusOut();

var datepicker = new ej.calendars.DatePicker({
close: function (args) {
    args.preventDefault();
}
});
datepicker.appendTo('#element');
datepicker.show();

var datepicker = new ej.calendars.DatePicker({
open: function (args) {
    args.preventDefault();
}
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({
enableRTL : true
});

var datepicker = new ej.calendars.DatePicker({
enableRtl : true
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({enablePersistence : true});

var datepicker = new ej.calendars.DatePicker({
enablePersistence : true
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ validationRules:{ required:true }});

var datepicker = new ej.calendars.DatePicker({
placeholder: 'Enter date'
});
datepicker.appendTo('#element');
var options = {  rules: {   'datevalue': {    required: true }} }
var formObject: FormValidator = new FormValidator('#form-element', options);

$("#datepicker").ejDatePicker({
validationRules:{ required:true },
validationMessage:{ required: "Required Date value"}
});

var datepicker = new ej.calendars.DatePicker({
placeholder: 'Enter date'
});

var options = {
rules: {
    'datevalue': {    required: [true, 'Date value required'] }
},
customPlacement: function (inputElement, errorElement) {
    inputElement.parentElement.parentElement.appendChild(errorElement);
}
};
var formObject = new ej.inputs.FormValidator('#form-element', options);
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ width: 200});

var datepicker = new ej.calendars.DatePicker({ width: '200px'});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ readOnly : true});

var datepicker = new ej.calendars.DatePicker({
readonly:true,
value:new Date()
});
datepicker.appendTo('#element');

var datepicker = new ej.calendars.DatePicker({ showClearButton: true});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ height: 35});

var datepicker = new ej.calendars.DatePicker({cssClass: 'e-custom-style'});
datepicker.appendTo('#element');

.e-control-wrapper.e-custom-style.e-date-wrapper.e-input-group{ height: 35px;}

$("#datepicker").ejDatePicker({ htmlAttributes : {required:"required"}});

$("#datepicker").ejDatePicker({ weekNumber : true});

var datepicker = new ej.calendars.DatePicker({ weekNumber:true});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ watermarkText: "Enter date"});

var datepicker = new ej.calendars.DatePicker({ placeholder: 'Enter date'});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ enabled: false});

var datepicker = new ej.calendars.DatePicker({enabled:false});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker();
var dateObj = $("#datepicker").data("ejDatePicker");
dateObj.disable();

$("#datepicker").ejDatePicker();
var dateObj = $("#datepicker").data("ejDatePicker");
dateObj.enable();

$("#datepicker").ejDatePicker({ allowEdit : true});

var datepicker = new ej.calendars.DatePicker({ allowEdit : true});
datepicker.appendTo('#element');

var datepicker = new ej.calendars.DatePicker({ zIndex: 100});
datepicker.appendTo('#element');

var datepicker = new ej.calendars.DatePicker({
placeholder: 'Enter date',
floatLabelType: 'Auto'
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({locale: "en-US"});

var datepicker = new ej.calendars.DatePicker({ locale: 'en'});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ startDay: 2});

var datepicker = new ej.calendars.DatePicker({ firstDayOfWeek: 2});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ enableStrictMode : true});

var datepicker = new ej.calendars.DatePicker({
strictMode: true,
value: new Date('5/28/2017'),
min: new Date('5/5/2017'),
max: new Date('5/25/2017')
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker({ close: function (args) { /*code block*/}});

var datepicker = new ej.calendars.DatePicker({
close: function (args) { /*code block*/}
});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker();
var dateObj = $("#datepicker").data("ejDatePicker");
dateObj.hide();

var datepicker = new ej.calendars.DatePicker({ value: new Date("05/11/2017")});datepicker.appendTo('#element');
datepicker.hide();

$("#datepicker").ejDatePicker({open: function (args) { /*code block*/}});

var datepicker = new ej.calendars.DatePicker({ open: function (args) { /*code block*/}});
datepicker.appendTo('#element');

$("#datepicker").ejDatePicker();
var dateObj = $("#datepicker").data("ejDatePicker");
dateObj.show();

var datepicker = new ej.calendars.DatePicker({ value: new Date("05/11/2017")});datepicker.appendTo('#element');
datepicker.show();

var datepicker = new ej.calendars.DatePicker({
value: new Date("09/04/2018"),
open:onOpen
});
datepicker.appendTo('#element');

function onOpen(args) {
datepicker.navigateTo('Year', new Date("03/18/2018"));
}

$("#datepicker").ejDatePicker({ navigate: function (args) { /*code block*/}});

var datepicker = new ej.calendars.DatePicker({navigated: onNavigate});
datepicker.appendTo('#element');
function onNavigate(args) { /*code block*/}

$("#datepicker").ejDatePicker({ allowDrillDown : true});