locking out the screen while postback

abhishekkashyap27 · August 3rd, 2009, 01:05 PM

Hi All

I have searched a lot on internet regarding locking out screen during postback but none seem to be working for me. I have a gridview with a textbox in the footer. On textbox text change event, i am hitting server and in turn doing a lot of validations. This is taking 4 to 5 seconds of time normally. I want to blackout the whole screen and have to show user a message "Processing, wait a while....". How to do this? Please throw some light...

-- Abhishek

jayshankar · August 17th, 2009, 07:30 AM

good query

alliancejhall · August 17th, 2009, 08:56 PM

Just use a modal. With AJAX there is the modal extender or you could just as easily use javascript.

something like

Javscript

Code:

<script language='javascript' type='text/javascript'>
    function showLoading()
       {
        document.getElementById('blackOut').style.display = 'block';
        document.getElementById('blackOut').style.height = '100%';
        document.getElementById('blackOut').style.width = '100%';
       }
</script>

then just create a hidden div and place somewhere on your page

Code:

            <div id="blackOut" style="display: none; position: absolute; background-color: black; filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; z-index: 999; top: 0px; left: 0px; height: 1%; width: 1%; ">
      <table width="100%" height="100%">
      <tr>
      <td align="center" valign="middle">
            <h2 style="color: White; font-weight: bold">Processing...</h2>
      </td>
      </tr>
      </table>
  </div>

then your code for your textbox

Code:

        <asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChaged" onblur="showLoading();"></asp:TextBox>

again this is just a BASIC example. The height = '100%' isn't supported in older browsers from what i understand but i'm sure you can come up with some method of getting the screen size. But the modalpopupextender might be the easiest thing for you to use.