Show Loading Image while submit the Form

Here you will need to have one gif image to show.

Add the style in header part.

<style type="text/css">

        .centered

        {

            position: fixed;

            top: 50%;

            left: 50%;

            margin-top: -75px;

            margin-left: -75px;

        }

    </style>

Add script in your header part.

$(document).ready(function () {

            $(".btnSubmit").click(function () {

                $('#dvLoader').show();

                if ($("#aspnetForm").valid()) {

                    return true;

                }

                else {

                    $('#dvLoader').hide();

                    return false;

                }

            });

        });

Add the following code to your body area to show loader.

<div id="dvLoader" style="display: none;">

                <div id="updateProgressBackgroundFilter" style="background-color: Gray;

                    filter: alpha(opacity=80); opacity: 0.80; width: 100%; top: 0px; left: 0px; position: fixed;

                    height: 800px;">

                </div>

                <div class="centered" style="font-family: Trebuchet MS;

                    filter: alpha(opacity=100); opacity: 1; font-size: small; position: absolute;

                    color: #FFFFFF;">

                    <img alt="Loading" src="../Images/ajax_loader.gif" height="150" width="150" />

                </div>

            </div>

Now add CssClass attribute to your submit button with value "btnSubmit".

<asp:Button ID="btnSubmit" runat="server" CssClass="btnSubmit" Text="Submit" />