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

18,009

Just use clear instead of clear().

Share:
18,009
shennyL
Author by

shennyL

Updated on July 21, 2022

Comments

  • shennyL
    shennyL almost 2 years

    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?