title: DatePicker Only Show Certain Dates
body: <p>I'm trying to build a form where students can pick a date to take a class. Classes are only given on certain dates of the month. I am having trouble with implementing the advanced code that limits to certain dates. I was going off this post below to help me. </p>
  
  <p><a href="https://stackoverflow.com/questions/7709320/jquery-ui-datepicker-enable-only-specific-days-in-array">jQuery UI Datepicker enable only specific days in array</a></p>
  
  <p>I started off creating a form with a simple input text box. I put the basic jquery code on and the pop up calendar worked fine. </p>
  
  <pre><code>$(function() {
      $( "#date" ).datepicker();
  });  
  </code></pre>
  
  <p>After that, I replaced the basic code and copied the code above so that it would only let certain dates be selected. I tried testing the form, and nothing happens if I click into the input box. I did test it at jfiddle and it worked fine so I am thinking it must be the way I'm implementing it or something. </p>
  
  <p>Here is the code I am trying to use: </p>
  
  <pre><code>&lt;script&gt;
      var availableDates = ["9-6-2012","14-6-2012","15-6-2012"];
  
      function available(date) {
          dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
          if ($.inArray(dmy, availableDates) !== -1) {
              return [true, "","Available"];
          } else {
              return [false,"","unAvailable"];
          }
      }
  
      $('#date').datepicker({ beforeShowDay: available });​
  &lt;/script&gt;
  </code></pre>
  
  <p>I've tried putting this in the head tag and the body tag without any luck. I'm not that advanced so any help would be appreciated. Thanks. </p>
  
  <p>jsFiddle for this problem: <a href="http://jsfiddle.net/szYYY/2/" rel="nofollow noreferrer">http://jsfiddle.net/szYYY/2/</a> .</p>