title: Inline datepicker beforeshowday won't fire until you change the month
body: <p>I've read several similar questions regarding inline datepicker and <code>beforeshowday</code> issues but I've yet to find an exact solution to my particular problem.</p>
  
  <p>I have a function <code>available</code> which sets certain dates available but it won't run until you actually change the month.</p>
  
  <pre><code>$( function() {
  
          $( "#whats-on-calendar" ).datepicker({
              numberOfMonths: 3,
              dateFormat: "dd/mm/yy",
              beforeShowDay: available,
              todayHighlight: true
          });
  
          var availableDates = ["9-9-2018","14-9-2018","15-9-2018"];
  
          function available(date) {
              dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
              if ($.inArray(dmy, availableDates) != -1) {
                  return [true, "","Available"];
              } else {
                  return [false,"","unAvailable"];
              }
          }
      } );
  </code></pre>
  
  <p><a href="https://jsfiddle.net/kwjxv5ot/4/" rel="nofollow noreferrer">https://jsfiddle.net/kwjxv5ot/4/</a></p>
  
  <p>I have read in the docs that for setting options after initialization, you need to use the <code>option()</code> method.</p>
  
  <pre><code>$("#whats-on-calendar").datepicker('option', 'beforeShowDay', available);
  </code></pre>
  
  <p>But that gives me the same problem. It won't fire until I change the month.</p>