In my web page I’m using a jQuery DateTimePicker control that requires jquery-1.4.1.min.js. On the same page I also have a jQuery NumericTextBox control that requires jquery-1.7.2. The problem is, as I need to reference both the versions of jQuery in the page for the controls to work, none of the either control is working because of the clash between the versions. How do I solve this?
An example of the reference in the script portion of the page markup follows:
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.dynDateTime.min.js" type="text/javascript"></script>
<script src="Scripts/calendar-en.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.js" type="text/javascript"></script>
<script src="Scripts/autoNumeric.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.NumericTextBox').autoNumeric('init');
$("#<%=DateOfBirthText.ClientID %>").dynDateTime({
ifFormat: '<%= Common.GetJScriptDateTimeFormat(DateTimeFormats.Date) %>',
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
singleClick: true,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
$("#<%=CommenceDateTimeText.ClientID %>").dynDateTime({
timeFormat: "12",
showsTime: true,
ifFormat: '<%= Common.GetJScriptDateTimeFormat(DateTimeFormats.DateTime) %>',
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
$("#<%=ReviewTimeText.ClientID %>").dynDateTime({
timeFormat: "12",
showsTime: true,
ifFormat: '<%= Common.GetJScriptDateTimeFormat(DateTimeFormats.Time) %>',
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
});
function ClearDateTime(controlName) {
switch (controlName) {
case 'DateOfBirthText':
document.getElementById('<%= DateOfBirthText.ClientID %>').value = "";
break;
case 'CommenceDateTimeText':
document.getElementById('<%= CommenceDateTimeText.ClientID %>').value = "";
break;
case 'ReviewTimeText':
document.getElementById('<%= ReviewTimeText.ClientID %>').value = "";
break;
default:
break;
}
return false;
}
function ClearToDoDate() {
document.getElementById('<%= ToDoCalendar.ClientID %>').SelectedDate = System.DateTime.MinValue;
return false;
}
function RemoveFileUploadSelectedFile() {
document.getElementById('<%= ImageUpload.ClientID %>').value = "";
return false;
}
</script>