Can't clear the input value after form is submited

Question

Ok, I\'ve tried every suggestion that I could find, but those values are still there after submitting form and fadeOut. If anyone has a suggestion...

Answer 1

Try setting the input values as blank when the value is submitted.

Eg, var name = $('input[name=name]').val(' ');

Answer 2

$("#form")[0].reset();

this could help

Answer 3

Edit: Why it's not working Read through your script. The suggestion you added (my code) is just a regular statement in the global scope - When the browser loads the file it

1. Sets the document ready method
2. Realizes the function validate
3. Executes the set-value-to-blank
4. Sets the ajaxForm value

I'm assuming you want to reset the form after it's been validated (and move on).

In that case, you want the resetting-code to run when the form is done. When is that? Here: $("#form1").ajaxForm(function(){...

Someone else has actually given you the exact code (I believe) but I really think it's an issue with your understanding of computers and javascript and how languages execute. You should really do more homework and try to follow the logic of your script. Simple debugging tools such as alert("I'm resetting the values now!") would tell you when your code is executing (whether it's in the right place or not)

---

Nowhere in your code does it actually try to clear the text. These would be some instructions to tell the browser to reset/erase the content. I'm guessing you want to clear it only when it's correct so you would add it to the .ajaxForm callback

var name = $('input[name=name]').val(''); //inputs are like this <input value="Hi">
var email = $('input[name=email]').val('');
var message = $('textarea[name=message]').html(''); //textareas are like this <textarea>Hi</textarea>

And by the way, fadeOut only makes it "fade out", it ends up hiding the block (css display: none; I'm guessing), but doesn't change the DOM element/form.

Answer 4

Use the .val() function to clear the values of text , and the html() function to clear the Also, it would be easier to manipulate in jQuery if you give each input an ID.

For example, create a form like this:

<form method="post" id="frmMessage" action="some_script.php">
<input type="text" name="name" id="txtName" />
<input type="text" name="email" id="txtEmail" />
<textarea name="message" id="txtMessage"></textarea>
</form>

Then in your jQuery code:

$("#frmMessage").ajaxForm( function()
{
    // Do whatever else you need to do first...
    // Fade out the form's container


    $("#txtName").val('');   // Clear the value of each box.
    $("#txtEmail").val('');  
    $("#txtMessage").html('');   // Different for textareas!

});