Opening a Jquery Dialog in the main window from iframe

I've been trying this for all day...

I've a form in a iframe and this contains jquery validate for the form validation. I just want that when the data is invalid, the jquery dialog appears in the main page, appears in top.document.

this is my code on iframe:

$("#dialog-message", top.document).dialog({                                                                      
             modal: true,
             autoOpen: false,
             buttons: { Ok: function() {
                 $(this).dialog('close');
               }
             }
          });

and this is a piece of code that should activate the dialog:

$("#search-form").validate({ 

        rules: { datapicker: {required: true,dateDE: true}},
        debug: true,
        messages: {
         datapicker: {
            required: "És necessari introduïr una data",  
            date: "S'ha d'afegir una data correcte: dd/mm/aaaa"
         }
        },
        errorPlacement: function(error, element) {
                error.prependTo($('#dialog-message', top.document));
        },
        errorLabelContainer: $("#dialog-message ul", top.document),
        showErrors: function () {
            $('#dialog-message',top.document).dialog('open');
            this.defaultS开发者_开发百科howErrors();
        }
});

so...this doesn't work and... If I try this instruction all works fine

$("#dialog-message", top.document).css(...) //works fine!

I think may be there's some problem with selector $-top.document and dialog function... Or may be isn't possible use dialog() for divs in different frames...

help please! :D

thanks in advance

Have the code in the iframe reference the parent, and call the parent's JavaScript function, something like this:

// in iframe code:
parent.doSearchFormValidate();

// parent page has definition for doSearchFormValidate().
function doSearchFormValidate() {
  $("#search-form").validate({ 
  ...
  });
}