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?
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
0
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>
0
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>
0
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

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>
0
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
0
RadhaKrishnaKiJayaAuthor Commented:
I am sorry but I could not make it work. Thank u for trying to help me.
0
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.
0

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.
0
RadhaKrishnaKiJayaAuthor Commented:
Is there anyway I can apply this to all the buttons on the form?
0
RadhaKrishnaKiJayaAuthor Commented:
It worked. Thank you.
0
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.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.