Buying Javascript Help with Form Submission

I'm using a very simple form to submit some data, which is shown below. What I want to do is utilize javascript to do the following:

1) On form submit button click, replace the submit button with a "Loading... " image/text and show it for about 5 seconds, then
2) Actually submit the form to execute.
3) Everything else needs to work the same, including the "if (isset..." function to display the submitted value.

<?
if (isset($raid_command)){
	echo $amount;
}else{
?>
<form method="post" action="">
<input type="hidden" name="amount" value="100" />
<input type="hidden" name="raid2_cost" value="200" />
<input class="btn" type="submit" name="raid_command" value="Raid Now!" />
<?}?>

Code (markup):

 

Hello brow,

you can use jquery to replace the button with some loading image,
then redirect it after 5 second..

try google : "javascript delay form post"

you'll find a lot of good source

 

Thanks! I almost got it. Take a look at the code below. This does the 2 steps that I need; however, the only problem is that this works when the button is type="button" and not type="submit". I need it to be type="submit" so that it posts the values. What am I missing here?

<script type="text/javascript">
        function submitForm() { // submits form
                document.getElementById("ismForm").submit();
        }
        function btnSearchClick()
        {
                if (document.getElementById("ismForm")) {
   document.getElementById('searchx').style.display = 'none';
                 document.getElementById('loading').style.display = 'block';            
                setTimeout("submitForm()", 5000); // set timout          
           }
        }
        </script>
<form method="post" id="ismForm" name="ismForm" action="test3.php?x" class="">
<input type="hidden" name="amount" value="100" />
<div id="loading" style="display:none;"><img src="http://article.onlinewebtool.com/wp-content/images/loading.gif" alt="" />Loading!</div>
        <input class="button" onclick="btnSearchClick();" type="button" id="searchx" name="searchx" value="Search" autocomplete="off">
        </form>

Code (markup):

 

Your issue is that you submit the form once you click the button if its type=submit and so the javascript dont fire. Your should add a return false on your onclick like

<input class="button" onclick="btnSearchClick(); return false;" type="submit" id="searchx" name="searchx" value="Search" autocomplete="off">

Code (markup):

But whats wrong if you use type="button"? See no problem with it