CODEWITHSUNDEEP
jqueryclicksubmit
scarhand
scarhand

Reputation: 4337

hide input[type=submit] and show loading image not working

using jquery, i am trying to hide the submit button and show an ajax loading gif once it is clicked.

it is working fine, but the form does not get submitted anymore.

heres my jquery code:

$('input[type=submit]').click(function () {
    $(this).parent('p').html('<img src="images/ajax-loader.gif" alt="loading" />');
    $(this).parent('form').submit();
});

heres my html:

<h1>add</h1>

<form method="post" action="form.php">

<p>
<label for="number">number:</label>
<input type="text" name="number" id="number" size="30" value="" />
</p>

<p style="text-align: center;">
<input type="submit" value="add" />
</p>

</form>

as you can see, i even added $(this).parent('form').submit(); and it still doesn't work.

Upvotes: 0

Views: 1167

Answers (1)

vzwick
vzwick

Reputation: 11044

Try this:

$('form').submit(function() {
    $('p:last-child', this).html('<img src="images/ajax-loader.gif" alt="loading" />');
});

Upvotes: 2

Related Questions