Jquery UI calendar in ajax loaded dialog

Question

I have link with onclick="open_dialog" which opens jquery ui dialog. It loads its content with ajax and that content loads another content test2.php with ajax that has input tag with class="calendar". Problem is that, if i click on input it won't show any calendar. Maybe somebody knows why?

function open_dialog() {
    var url = 'test.php'; 
    var dialog;
    if ($('#test').length) {
        dialog = $('#test');
    } else {
        dialog = $('<div id="test" class="type_' + type + '" style="display:hidden;"></div>').appendTo('body');
    }
    dialog.load(
        url, 
        {},
        function (responseText, textStatus, XMLHttpRequest) {
            dialog.dialog({
                open: function(event, ui) {
                    $('.calendar').datepicker();
                }
            });
        }
    );
    return false;
}

Answer 1

Sorry, but i found the answer: I had to call calendar in second ajax call like this:

$('#content_in_test_dialog').load(
    'test2.php', 
    function(response, status, xhr) {
        $('.calendar').datepicker();
    }
);

Answer 2

At first you should to find the problem? 1) first add alert('first line of open_dialog function'); and check is call or not. 2) second check that is calendar added self html content to html page. May be it added self content, but some css style hide it.