CODEWITHSUNDEEP
javascriptformsreset
user2267855
user2267855

Reputation: 1

Javascript issue re form reset

I've got an issue with a small javascript form that submits perfectly, brings up the success message but fails to reset the form. The data remains visible, until you manually refresh the page.

The code is:

jQuery(document).ready(function(){

    $('#contactform').submit(function(){

        var action = $(this).attr('action');

        $("#message").slideUp(750,function() {
        $('#message').hide();

        $('#submit')
            .after('<img src="images/ajax-loader.gif" class="loader" />')
            .attr('disabled','disabled');

        $.post(action, {
            name: $('#name').val(),
            email: $('#email').val(),
            phone: $('#phone').val(),
            subject: $('#subject').val(),
            comments: $('#comments').val(),
            verify: $('#verify').val()
        },
            function(data){
                document.getElementById('message').innerHTML = data;
                $('#message').slideDown('slow');
                $('#contactform img.loader').fadeOut('slow',function(){$(this).remove()});
                $('#submit').removeAttr('disabled');
                if(data.match('success') != null);

            }
        );

        });

        return false;

    });

});

I wondered if I can add in a reset command but as my java is limited I'm not sure where? Would appreciate any pointers or advice. Thanks in advance.

Upvotes: 0

Views: 207

Answers (2)

Menelaos
Menelaos

Reputation: 25725

You need to manually clear/reset the form. As you using JQuery to send the request, it is not like form action that changes your browser location.

Just call RESET once the data has been successfully sent.

For more on that see: http://www.w3schools.com/jsref/met_form_reset.asp

If on the other hand you want to reset your form values to defaults you specify you can create a function such as:

function resetFormValues() 
{ 
$('#name').val('name'); 
$('#email').val('email'); 
etc..
}

and call resetFormValues(); from within your code such as:

if (data.match("success") != null){
   resetFormValues();
}

Upvotes: 0

tomor
tomor

Reputation: 1765

You could add this inside the if (data.match...), as follows: 

if (data.match("success") != null){
   $('#contactform')[0].reset();
}

Upvotes: 2

Related Questions