jQuery UI Dialog - Reset form value & validation after dialog close (x) or cancel

Question

I got my form in jQuery ui dialog and I apply client-side validation in it. I wish to clear all input values as well as any validation messages the once user clicks (x) to close the dialog or the "Cancel" button, before submitting the form.

I tried to include a clear form function in the "close" event, but it didn't work:

 //Load food form into dialog
    var controllerUrl = '/Stock/GetFoodForm';
    var $createdialog = $('#createfooddialog').load(controllerUrl).dialog({
        autoOpen: false,
        title: 'Create Food',
        modal: true,
        width: 'auto',
        close: clear()
    });

The clear function is used in the function in jquery.form.js plugin:

// Function to clear form data
function clear() {
    $('#formData').resetForm();
    $('.validation-summary-valid').val("");
}

Any idea how can I clear everything in the form once the user closes the dialog even though the form is not submitted?

Answer 1

Just use clear instead of clear().