Clear form values after ajax submission. [closed]

Question 1

You can use reset() function to literally reset the form to it originally state.

If you are submitting the form with ajax... can be done with a callback function, but I suggest to do it with .done() along with fail() functions, to handle both scenarios.

So, will be something like:

$.post( "example_post_page.php", example_form_data )
    .done(function() {
        // Looks good
        // Let the user know with a message and then, clears the form.
        alert( "success" );
        $('#form-contact')[0].reset();
        // -------------------^ Same behavior as <input type="reset" /> element.
    })
    .fail(function() {
        // Show some warning message
        // Don't clear the data, so the user don't have to type all over again.
        alert( "error" );
    });

Of course, this is just an example, can be improved, like for example... replace those alerts, witha a nice modal box, add some warning class to the fields with errors, and so on...

More info: jquery.post

Question 2

You can add a class to all of your inputs, like '.input'. Then, in the success function you can use a class selector to clear all the inputs at once like this:

$('.input').val('')

That will save you writing a line of code for each input. Much cleaner.

Question 3

You'll want to clear the answers then Remove the validation, try this code

var $form = $('#form-contact');
$form.find('input, textarea').val('');
SimpleForm.clearErrors($form)

Question 4

Just put a common class to all fields say e.g. - clearMe, and in your ajax's success section simply put $(".clearMe").val("").