I have 2 jquery script and 1 javascript which are conflicting with each other.
Below is code. Please let me know how to resolve this
1.) jquery for calender
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script type="text/javascript">
function getCityDate(cityName,StarType)
{
if(cityName && StarType)
{
// Call the php page to get the HTML
$.ajax({
url: 'ajaxSearchHotelDateSelect.php?cityName='+cityName+'&StarType='+StarType,
success: function(responseHTML) {
// Set the HTML somewhere on the page - note: if you are returning a full page of HTML you shouldn't include all the <html><body> tags etc...
$("#homeMainTextDiv").html(responseHTML);
// Now that your HTML is available in the DOM you can initiate the datepicker()
$("#StartDate").datepicker({
numberOfMonths: 3,
minDate: "0",
maxDate: "+1Y",
dateFormat : "dd-mm-yy",
/*
altFormat: "dd-mm-yy",
maxDate: "+3M +10D",
changeMonth: true,
changeYear: true,
showWeek: true,
firstDay: 1,
*/
showOn: "button",
buttonImage: "images/calander_hotel_booking_final.png",
showAnim: "slideDown",
buttonImageOnly: true,
showButtonPanel: true
});
}
});
}//if(cityName && StarType)
}
</script>
2.) jquery for auto complete
<script type="text/javascript" src="jquery/ajax-autocomplete/jquery.js"></script>
<script type='text/javascript' src='jquery/ajax-autocomplete/jquery.autocomplete.js'></script>
<link rel="stylesheet" type="text/css" href="jquery/ajax-autocomplete/jquery.autocomplete.css" />
<script type="text/javascript">
$().ready(function() {
$("#searchText").autocomplete("ajaxSearchAutoComplete.php", {
width: 750,
matchContains: true,
mustMatch: true,
minChars: 3,
//multiple: true,
//highlight: true,
//multipleSeparator: ",",
selectFirst: true
});
});
</script>
3.) Javascript for pop window with blackout screen
<body onload="Popup.showModal('modal',null,null,{'screenColor':'#333333','screenOpacity':.5});return false;" >
<script src="js/popup.js" type="text/javascript"></script>
<center>
<div id="modal" style="border:0px solid #0066FF ; padding:5px; font-size:150%; text-align:center; display:none; width:300px; height:250px;">
<a href="index.php" target="_self"></a><input type="image" src="images/close.png" width="30" height="30" alt="X" onClick="Popup.hide('modal')" style="cursor:pointer; float:right;">
<div style="background:url(images/homeDateSelectionBg.png) no-repeat left top; width:292px; height:192px; margin-top:25px;">
</div>
</div>
</center>
If I remove auto comlete jquery and pop up javascript, calender fine work fine else not .
How to fix that? My calender is coming via ajax and in pop window.
<script type="text/javascript" src="jquery/ajax-autocomplete/jquery.js"></script>