• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 391
  • Last Modified:

JQuery Calendar - won't disappear on date selection

Hi I had this problem before but realised it was caused by bad JQuery syntax.  I'm a JQuery newbie so please bear with me :-).  It was ever since I added the code to set the date field to tomorrow's date that it started going wrong.  I'd be grateful if someone could tell me where I'm going wrong in my syntax.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title>Cross Keys Hotel, London/title>

<link rel="stylesheet" type="text/css" href="styles/baseline.css" />
<link rel="stylesheet" type="text/css" href="styles/jquery.lightbox-0.5.css" media="screen" />
<link rel="stylesheet" type="text/css" href="styles/jquery-ui.css" media="screen" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>

<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>

<script type="text/javascript">

$(document).ready(function() {

			onSelect: function(dateText, inst) {
				var s = dateText.split("/");


$("#Date").datepicker('option', {dateFormat: 'dd/mm/yy'}); 

var myDate = new Date();
    var day = myDate.getDate() + 1;
    var month = myDate.getMonth() + 1;
    var ukDate = day + '/' + month + '/' + myDate.getFullYear();

$('a[rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel



<body id="county" class="booking"> 

<div id="booking">
<h3>Find &amp; Book</h3>
<form name="bookingForm" id="bookingForm" method="post" action="http://www.hotelexec.co.uk/external.asp" autocomplete="off">
<input name="$LICENCE$" type="hidden" value="xxxxxx" />
<input name="$SMOKING$" type="hidden" value="" />

<input name="$SOURCE$" type="hidden" value="" />
<input name="$LEDGER$" type="hidden" value="" />
<input name="$DAY$" id="Day" type="hidden" value="" />
<input name="$MONTH$" id="Month" type="hidden" value="" />
<input name="$YEAR$" id="Year" type="hidden" value="" />
<label for="Date">Arrival <br/> Date</label>
<input id="Date" name="Date" type="text" value="" autocomplete="off" class="required" />
<label for="Nights">Number <br/> of nights</label>
<!--<input id="Nights" name="$NIGHTS$" type="text" value="1" />-->
<select id="Nights" name="$NIGHTS$">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>

<option value="20">20</option>
<option value="21">21</option>
<input type="submit" name="Submit" value="Check for Availability" class="submit" />


Open in new window

1 Solution
Albert Van HalenAnalyst developerCommented:
Use 1 assignment of the the datepicker to your #Date element.
	onSelect: function(dateText, inst) {
		var s = dateText.split("/");
	dateFormat: 'dd/mm/yy'

Open in new window


Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now