Advice on JQuery UI Dialog

Question

On my form I need to perform a task where a message appears if a users matches the criteria of being entered in to win a prize. Basically if they have a certain postcode then this message needs to appear. If they don't then the message doesn't appear. I need this to happen when they click submit. I have written a regex for the postcodes.

I have been using the Validate plugin to perform all the validation but have been looking at Dialog for the message. Can the two work together? Do I need to do anything special to the code so that I can use both? Some people have mentioned using submitHandler on the validate Plugin would this be easier? I'm not sure how to write the code though.

Also is there a method I can use in the Dialog so that the box doesn't appear all the time and only when they have a certain postcode? Also from the dialog box I need the form to be sent to the server. Is this achieveable?

I am very new to JavaScript and even newer to JQuery so can someone respond as if they were talking to a dummy please? Just so I can get my head around what needs to be done.

Thanks

Answer 1

You could use invalidHandler option to display dialog box. submitHandler option is used to run custom code if there are no validation errors.

$('form').validate({
    invalidHandler: function (form, validator) {
        if ( ... ) { // check if postcode is wrong
            $('#dialog').dialog(); // show the dialog
        }
    }
});