<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxcalendar.css">
<script>
window.dhx_globalImgPath = "../../codebase/imgs/";</script>
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxcalendar.js"></script>
<script>
var mCal;
window.onload = function() {
    mCal = new dhtmlxCalendarObject('dhtmlxCalendar', false, {
        isYearEditable: true,
        isMonthEditable: true,
        headerButtons: 'M'
    });
    mCal.loadUserLanguage('en-us');
    mCal.setYearsRange(2000, 2010);
    mCal.setInsensitiveDates(["02-11,2010-06-12,2010-08-13,2010-11-19,10-20"]);
    mCal.draw();
}
function setDates() {
    mCal.setInsensitiveDates([document.getElementById('datesArea').value]);
    mCal.draw();
}</script>
 
 
<table cellpadding="10">
  <tr>
<td valign="top"><div id="dhtmlxCalendar"></div></td>
    <td  valign="top">
        <textarea id="datesArea" style="width:400px; height:100px;">02-11,2008-05-12,2008-06-13,2008-09-19,10-20</textarea>
        <br />
        <input type="button" value="Set dates" onclick=setDates();>
    </td>
  </tr>
</table>
 
<br>