Disable all the button on the form when Submit button is clicked

Hi Expert,

I want to freeze the form when Submit button is clicked so that the user can not click any of the button while the server is processing the data. I am using ASP.net and VB.net

Thanks.
RadhaKrishnaKiJayaAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

David_zuCommented:
You can Javascript. It will help to create a mask div, it will cover your form until the page is completely loaded.

You can use following code in your page.

<form>
<div id="mask" style="position:fixed; top:0;left:0;width:100%;height:100%;background:#ccc;opacity:0.6;z-index:99999;display:none">
      <div style=";position:absolute;top:50%;left:50%;width:32px;height:32px;margin-top:-16px;background:#eee;margin-left:-16px;">
            Please Wait...
    </div>
</div>
<div>
 Your page
</div>
</form>

Use following code in Submit button
onClientClick = "document.getElementById('mask').style.display='initial';"

Before SubmitAfter Submit
RadhaKrishnaKiJayaAuthor Commented:
Hi,
Thank you for your reply. I tried to use it. But  not sure why it is not working for me. This is my code. Please help. Thank yiu

<body>
    <form id="form1" runat="server">
     <div style="float:left; width:99.9%;">
        <table>
          <tr>
             <td>
                <%--<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick ="ShowMessage('WaitLabel')"  />--%>
                 <asp:Button ID="btnSubmit" runat="server" Text="Submit" onClientClick = "document.getElementById('mask').style.display='initial';"/>
             </td>                      
          </tr>
        </table>
    </div>

    <div style="float:left;" >
        <asp:GridView ID="GVViewParts" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None"  showfooter="true"  Width="99.4%" > <%--OnRowDataBound="setMouseover"--%>
            <AlternatingRowStyle BackColor="White" />
            <%--<EditRowStyle BackColor="#2461BF" />--%>
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                     
            <RowStyle BackColor="#EFF3FB" />
            <%--<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />--%>
            <SortedAscendingCellStyle BackColor="#F5F7FB" />
            <SortedAscendingHeaderStyle BackColor="#6D95E1" />
            <SortedDescendingCellStyle BackColor="#E9EBEF" />
            <SortedDescendingHeaderStyle BackColor="#4870BE" />
           
        </asp:GridView>
    </div>
    <div id="mask" style="position:fixed; top:0;left:0;width:100%;height:100%;background:#ccc;opacity:0.6;z-index:99999;display:none">
        <div style="position:absolute;top:50%;left:50%;width:32px;height:32px;margin-top:-16px;background:#eee;margin-left:-16px;">
                Please Wait...
        </div>
    </div>
   </form>
</body>
David_zuCommented:
mask div shall before all other div

<body>
    <form id="form1" runat="server">
    <div id="mask" style="position:fixed; top:0;left:0;width:100%;height:100%;background:#ccc;opacity:0.6;z-index:99999;display:none">
        <div style="position:absolute;top:50%;left:50%;width:32px;height:32px;margin-top:-16px;background:#eee;margin-left:-16px;">
                Please Wait...
        </div>
    </div>

     <div style="float:left; width:99.9%;">
        <table>
          <tr>
             <td>
                <%--<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick ="ShowMessage('WaitLabel')"  />--%>
                 <asp:Button ID="btnSubmit" runat="server" Text="Submit" onClientClick = "document.getElementById('mask').style.display='initial';"/>
             </td>                      
          </tr>
        </table>
    </div>

    <div style="float:left;" >
        <asp:GridView ID="GVViewParts" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None"  showfooter="true"  Width="99.4%" > <%--OnRowDataBound="setMouseover"--%>
            <AlternatingRowStyle BackColor="White" />
            <%--<EditRowStyle BackColor="#2461BF" />--%>
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                     
            <RowStyle BackColor="#EFF3FB" />
            <%--<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />--%>
            <SortedAscendingCellStyle BackColor="#F5F7FB" />
            <SortedAscendingHeaderStyle BackColor="#6D95E1" />
            <SortedDescendingCellStyle BackColor="#E9EBEF" />
            <SortedDescendingHeaderStyle BackColor="#4870BE" />
           
        </asp:GridView>
    </div>
   </form>
</body>
HTML5 and CSS3 Fundamentals

Build a website from the ground up by first learning the fundamentals of HTML5 and CSS3, the two popular programming languages used to present content online. HTML deals with fonts, colors, graphics, and hyperlinks, while CSS describes how HTML elements are to be displayed.

RadhaKrishnaKiJayaAuthor Commented:
I moved it to the first. But still no help.

<form id="form1" runat="server">
    <div id="mask" style="position:fixed; top:0;left:0;width:100%;height:100%;background:#ccc;opacity:0.6;z-index:99999;display:none">
        <div style="position:absolute;top:50%;left:50%;width:32px;height:32px;margin-top:-16px;background:#eee;margin-left:-16px;">
                Please Wait...
        </div>
    </div>
     <div style="float:left; width:99.9%;">
        <table>
          <tr>
             <td>
                <%--<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick ="ShowMessage('WaitLabel')"  />--%>
                 <asp:Button ID="btnSubmit" runat="server" Text="Submit" onClientClick = "document.getElementById('mask').style.display='initial';"/>
             </td>                      
          </tr>
        </table>
    </div>

    <div style="float:left;" >
        <asp:GridView ID="GVViewParts" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None"  showfooter="true"  Width="99.4%" > <%--OnRowDataBound="setMouseover"--%>
            <AlternatingRowStyle BackColor="White" />
            <%--<EditRowStyle BackColor="#2461BF" />--%>
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                     
            <RowStyle BackColor="#EFF3FB" />
            <%--<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />--%>
            <SortedAscendingCellStyle BackColor="#F5F7FB" />
            <SortedAscendingHeaderStyle BackColor="#6D95E1" />
            <SortedDescendingCellStyle BackColor="#E9EBEF" />
            <SortedDescendingHeaderStyle BackColor="#4870BE" />
           
        </asp:GridView>
    </div>
   
   </form>
David_zuCommented:
It actually works. The script will help to to mask the form when the form is submitted to server. When the page is rendered, the mask will be reset as well.

You can use a custom control if you want to use ASP.NET code style. Download the attached zip file and try. Reference of custom asp.net control (http://www.codeproject.com/Articles/28783/Your-First-ASP-NET-Custom-Control).
WebAppTest.zip
RadhaKrishnaKiJayaAuthor Commented:
I am sorry but I could not make it work. Thank u for trying to help me.
Jitendra PatilSr.Software EngineerCommented:
can you try the below code
<asp:Button ID="btnSubmit" runat="server" Text="Submit" onClientClick = "document.getElementById('mask').style.display='block';"/>

hope this helps.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
RadhaKrishnaKiJayaAuthor Commented:
Thank you for ur reply. I will try and get back to you.
RadhaKrishnaKiJayaAuthor Commented:
Is there anyway I can apply this to all the buttons on the form?
RadhaKrishnaKiJayaAuthor Commented:
It worked. Thank you.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.