[SOLVED] datepicker in dialog triggers on focus instead of on click

[SOLVED] datepicker in dialog triggers on focus instead of on click

I have the following code that load()'s a page containing a datepicker within a dialog.

The dialog only contains the datepicker and a submit button. When the dialog opens, the cursor by default is on the datepicker text field.

The problem is that the datepicker only appears if i lose focus on the datepicker text field (by tabbing) and then clicking back onto the datepicker text field instead of displaying the datepicker everytime I click inside the text field.

What do I need to ad to my code in order to display the datepicker everytime I click inside the datepicker's text field?

The code I have is:
  $('#showdialog').click(function () {
    $("#example").load("/programs/2/edit", function() {
      $(this).dialog({
        modal:true,
        buttons: {
          "Close": function() { $(this).dialog("destroy"); }
        },
        open : function() {
          if (jQuery('input.datepicker').length > 0)
            jQuery('input.datepicker').datepicker({dateFormat: 'dd-mm-yy'});
          }
      });
    });
    return false;
  });
















Thanks in advance