I have a application where I am trying to implement keith-wood calendar-picker for differenct calendars and I have also added date.js in my application. The problem is date.js and keith-wood together in the same file is not working because of some reason.
Here is the code.
$(document).ready(function() {
// create jqxInput
$("#input").jqxInput({
placeHolder: "Enter a Country",
height: 23,
width: 350,
minLength: 1
});
if (theme == "black" || theme == "darkblue" || theme == "shinyblack") {
$("img")[0].src = "../../images/search_white_lg.png"
}
$("#input2").calendarsPicker({
showTrigger: '#search',
showOtherMonths: true,
selectOtherMonths: true,
calendar: $.calendars.instance('islamic', 'fa'),
renderer: $.extend({}, $.calendarsPicker.defaultRenderer, {
picker: $.calendarsPicker.defaultRenderer.picker.
replace(/\{link:clear\}/, '').
replace(/\{link:close\}/, ''),
otherMonthClass: "classforOthersMonths"
})
});
});<!DOCTYPE html>
<html lang="en">
<head>
<title id='Description'>This sample illustrates how to add a button after jqxInput. The same approach can be used for adding content before, after, or on both sides of the jqxInput.</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css" rel="stylesheet" />
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<!-- keith wood calendar picker files -->
<script type="text/javascript" src="js/jquery.calendars.js"></script>
<script type="text/javascript" src="js/jquery.calendars.plus.js"></script>
<script type="text/javascript" src="js/jquery.plugin.js"></script>
<script type="text/javascript" src="js/jquery.calendars.picker.js"></script>
<script src="js/jquery.calendars.islamic.js"></script>
<!-- -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/smoothness.calendars.picker.css">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,600,700">
</head>
<body class='default'>
<div id='content'>
<div id="input">
<input id="input2" type="text" />
<div id="search"><img alt="search" width="16" height="16" src="../../images/search_lg.png" /></div>
</div>
</div>
</body>
</html>this is the error message I get
Uncaught TypeError: year.calendar is not a function
In keith-wood calendar,year is an object type and in date.js year is a integer. Is there any work around to solve this issue?
PS:there is no cdn for keith-wood calendar picker so I can't demonstrate in here. and I can't remove date.js from my application.
