Display Loading progress (Loader) in ASP.Net using jQuery

kevinf
 
on May 22, 2022 10:57 PM
599 Views

Hi 

I am trying to show a progressing script then the program is processing and it's not displaying.

can you help.

    <script type="text/javascript">
        function ShowProgress() {
            setTimeout(function () {
                var modal = $('<div />');
                modal.addClass("modal");
                $('body').append(modal);
                var loading = $(".loading");
                loading.show();
                var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
                var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
                loading.css({ top: top, left: left });
            }, 200);
        }
        $('form').on("submit", function () {
            ShowProgress();
        });

        function myShowProgress() {
            setTimeout(function () {
                var modal = $('<div />');
                modal.addClass("modal");
                $('body').append(modal);
                var loading = $(".loading");
                loading.show();
                var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
                var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
                loading.css({ top: top, left: left });
            }, 200);
        }
        $('#form').on("submit", function () {
            myShowProgress();
        });

    </script>
    <style>
        .fb {
            font-size: x-large !important;
        }
    </style>
</head>
<body>
    <div id="grad" style="z-index: 1"></div>
    <form id="form1" runat="server" autocomplete="off" style="z-index: 1">
        <asp:Panel ID="pcenter" runat="server" Height="264px" Style="z-index: 1">
            <asp:Button Text="No" ID="btnNo" runat="server" OnClick="OnNo" Style="display: none;" />
            <asp:Button Text="Yes" ID="btnYes" runat="server" OnClick="OnYes" Style="display: none;" />
            <asp:HiddenField ID="hfYesMessage" runat="server" />
            <div id="dialog">
            </div>
            <asp:Button ID="bSpinner" runat="server" Style="z-index: -1; left: 5px; top: 190px; position: absolute" Text="Spinner" OnClick="bSpinner_click" Visible="false" />
            <div class="loading" align="center" style="z-index: -1">
                <br />
                <n>Processing - Please wait.</n>
                <br />
                <br />
                <img src="../images/LoaderRing.gif" />
            </div>

 

Download FREE API for Word, Excel and PDF in ASP.Net: Download
kevinf
 
on May 23, 2022 09:52 PM

Thanks found reply in ASP 

Display Loading progress on PostBack in ASP.Net

 checking it