日期选择器与禁用日期JQuery UI问题

Question

I need to update the disabled dates of a UI Jquery datepicker when a different city is chosen from a combo box, so what iv done is onchange of the combo box run the following function which does an ajax call to a php script which hits the DB via sql and returns the dates based on the city whcih i dump into the unavalibledates variable and rerun the .datepicker

This only works the first time its run, after which is does not update, but does not error. how do I make it update.

function update_datepicker()
{
$.ajax({  
    type: "POST",  
    url: "scripts/deals.php?val=05&city="+document.getElementById('city_combo').value,  
    success: function (temp2)
         {
            var unavailableDates = [eval(temp2)];
            function unavailable(date) {
                  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
                  if ($.inArray(dmy, unavailableDates) == -1) {
                    return [true, ""];
                  } else {
                    return [false,"","Unavailable"];
                  }
                }

            $('#datepicker').datepicker({ beforeShowDay: unavailable });
         }

      });
}

Answer 1

do not create every time a new datepicker, just update your current

var unavailableDates;
function unavailable(date) {
    dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
    if ($.inArray(dmy, unavailableDates) == -1) {
        return [true, ""];
    } else {
        return [false,"","Unavailable"];
    }
}
var dp = $('#datepicker').datepicker({ beforeShowDay: unavailable });
function update_datepicker()
    {
    $.ajax({  
        type: "POST",url: "scripts/deals.php?val=05&city="+$('#city_combo').val(),  
        success: function (temp2)
        {unavailableDates = [eval(temp2)];}

    });
}

Answer 2

just add, $('#datepicker').datepicker( "destroy" ); Before you recreate it, hope this helps otehrs