BeforeShowDate срабатывает перед $.ajax
 

Добрый день

С помощью следующего кода планировала выбрать дату на календаре
(datepicker UI) -> записать дату в бд -> и соответственного тут же отметить ее на календаре без перезагрузки страницы.

var disabledDays = <?php echo $json;?>;
    jQuery(document).ready(function() {
        $( "#datepicker").datepicker({
            dateFormat: 'dd/mm/yy',
            altField: '#input',
            beforeShowDay: function(date) {
                date = $.datepicker.formatDate('dd/mm/yy', date);
                for (i = 0; i < disabledDays.length; i++) {
                    if($.inArray(date,disabledDays) != -1) {
                        return [true, 'ui-state-active', 'available'];
                    }                                            
                }
                return [true];
            },
            onSelect: function(dateText, inst) {
                $.ajax({
                    type: 'POST',
                    url: "process.php",
                    dataType: "json",
                    data: {input:dateText},
                    success: function(data) {
                        console.log("Done");
                    }
                });
            }

        });
    });

В итоге дата в бд записывается, но чтобы она отметилась на календаре нужно перезагрузить страницу, вероятно, beforeShowDay срабатывает
раньше $.ajax?

Попробовала убрать асинхронность и обновить календарь после выполнения запроса, но это наверное не в ту степь?
Подскажите как получить отмеченные даты после добавления в бд
без перезагрузки страницы?

var disabledDays = <?php echo $json;?>;
    jQuery(document).ready(function() {
        $( "#datepicker").datepicker({
            dateFormat: 'dd/mm/yy',
            altField: '#input',
            onSelect: function(dateText, inst) {
                $.ajax({
                    async: false,
                    type: 'POST',
                    url: "process.php",
                    dataType: "json",
                    data: {input:dateText},
                    success: function(data) {
                        $('#datepicker').datepicker('refresh');
                    }
                });
            },
            beforeShowDay: function(date) {  
                date = $.datepicker.formatDate('dd/mm/yy', date);
                for (i = 0; i < disabledDays.length; i++) { 
                    if($.inArray(date,disabledDays) != -1) {                     
                        return [true, 'ui-state-active', 'available']; 
                                                                       
                    }                                              
                }
                return [true];
            }
        });
    });

...
disabledDays.push(dateText) ;
$('#datepicker').datepicker('refresh');
...

Вот это да! Волшебство! Работает, моему счастью нет предела!
Как вы так быстро ориентируетесь что и где не работает и как поправить?
Я даже в сторону .push(); не подумала бы, что так можно,
искала ответ в документации к виджету?
Спасибо вам огромное!

P.S. За ссылку отдельное спасибо. Она то, что нужно. Угадали)

nina_,
на всякий случай:
в коде по ссылке, тогда я не знал о встроенном методе форматирования даты и парсил дату, у вас это правильнее

date = $.datepicker.formatDate('dd/mm/yy', date);