title: Jquery Datepicker not closing on select?
body: <p>My code:</p>
  
  <pre><code> var availableDates = ["23-1-2013","24-1-2013","25-1-2013"];
  
          function available(date) {
            dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
            if ($.inArray(dmy, availableDates) !== -1) {
              return [true, "","Available"];
            } else {
              return [false,"","unAvailable"];
            }
          }
  
  
          $("a.pickadate").click(function () {
              $("#datepicker").datepicker({
                      beforeShowDay: available,
                      altField: '#datepicked',
                      dateFormat: "dd-mm-yy"
                  });
          });
          $("#datepicker a.ui-state-default").click(function () {
              $("#datepicker").datepicker("hide");
          });
  </code></pre>
  
  <p>It opens fine, populates the fields fine and shows the correct date's fine as well; just when I select something it stays open.</p>
  
  <p>And my HTML is: </p>
  
  <pre><code>&lt;input type="text" id="datepicked" name="datepicked" size="8" style="float: left;"&gt;
      &lt;a href="javascript:void();" class="pickadate"&gt;
          &lt;img src="media/images/icon-calendar.gif" style="float: left; margin-right: 10px;"&gt;
      &lt;/a&gt;    
      &lt;!-- Datepicker --&gt;
      &lt;div id="datepicker" style="position: absolute; left: 670px; border: 0px; z-index: 5000; top: 247px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Why isn't it closing?  Is it to do with the CSS in the style tag? I don't know where I should put that otherwise.  If i take that out, it doesn't close, and the positioning is awful.</p>