title: Datepicker - Using a default function with a custom function
body: <p>Currently, I have this custom function:</p>
  
  <pre><code>var $myBadDates = new Array(&lt;?php foreach($aryDates as $disabledate) { echo ' "$disabledate",'; } echo " 1"; ?&gt;);
  // Creates the array (The echo " 1"; is merely to close the array and will not affect the outcome
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>function checkAvailability(mydate) {
      var $return = true;
      var $returnclass = "available";
      $checkdate = $.datepicker.formatDate('yy-mm-dd', mydate);
      for (var i = 0; i &lt; $myBadDates.length; i++) {
          if ($myBadDates[i] == $checkdate) {
              $return = false;
              $returnclass = "unavailable";
          }
      }
      return [$return, $returnclass];
  }
  </code></pre>
  
  <p>The datepicker section goes as such:</p>
  
  <pre><code>$(function () {
      //To enable End Date picker only when Start Date has been chosen (And to disable all dates prior of said date)
      var end = $('#enddate').datepicker({
          numberOfMonths: 3,
          stepMonths: 3,
          beforeShowDay: checkAvailability
      });
      // Defining a function, because we're binding this to two different events
      function enableEnd() {
          end.attr('disabled', !this.value.length) // Enable the end input element if the first one has anything in it
          .datepicker('option', 'minDate', this.value); // Set the minimum date to the date in the first input
      }
      //End of function
      // Datepicker
      $('#startdate').datepicker({
          numberOfMonths: 3,
          stepMonths: 3,
          beforeShowDay: checkAvailability,
          minDate: +1,
          onSelect: enableEnd // Call enableEnd when a date is selected in the first datepicker
      }).bind('input', enableEnd); // Do the same when something is inputted by the user
      //hover states on the static widgets
      $('#dialog_link, ul#icons li').hover(
  
      function () {
          $(this).toggleClass('ui-state-hover');
      });
  });
  //End of Function​
  </code></pre>
  
  <p>What I do is from my SQL DB, i use a custom function that changes a start date and an end date to an array of dates, which is then pushed into a single array and used to disable the said dates.<br>
  The second datepicker is only enabled when a valid date from the first is returned as <code>TRUE</code>.</p>
  
  <p>The problem now is this:<br>
  I can block out all the dates that I have to. Great. But now, how do I block out weekends on top of this?<br>
  <code>beforeShowDay: $.datepicker.noWeekends</code> can't work because I'm already using a custom function. So, I have to customize my custom function even further. I can't use getDate() and show those > than 0 and &lt; 7, so how can I tackle this?  </p>
  
  <p>Any help, answer of even a tip would help. I've been trying this out for sometime and I haven't gotten anywhere. Thanks.</p>