ASP.NETのWebページでSubmit時に画面をロックする

.NET

基本的な考え方は、Submit直前に画面を覆うDIVを作成して画面上のコントロールをクリックできないようにします。DIVタグを利用する場合、IE6の問題でSelectタグが常にトップレベルに表示されてしまうので、Selectタグについてはdisplayをhiddenに設定して表示しないようにしています。

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
                        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        System.Threading.Thread.Sleep(3000)
    End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>無題のページ</title>
    <style type="text/css">
        .guardBackground {
	        background-color:Gray;
	        filter:alpha(opacity=30);
	        opacity:0.3;
        }    
    </style>
    <script type="text/javascript">
       
        function DisableScreen()
        {
            var tagElements = document.getElementsByTagName('SELECT');
            for (var k = 0 ; k < tagElements.length; k++) {
                tagElements[k].style.visibility = 'hidden';
            }
            var gDiv;
            gDiv = document.createElement('div');
            gDiv.style.position = 'absolute';
            gDiv.className = 'guardBackground';
            gDiv.style.zIndex = 9999;
            window.document.forms[0].appendChild(gDiv)
            
            guardScreen(gDiv);
            window.attachEvent("onresize",function(){guardScreen(gDiv);});
            window.attachEvent("onscroll",function(){guardScreen(gDiv);});
        }

        function guardScreen(ele)
        {               
            var left = (document.documentElement.scrollLeft 
		        ? document.documentElement.scrollLeft : document.body.scrollLeft);
            var top = (document.documentElement.scrollTop 
		        ? document.documentElement.scrollTop : document.body.scrollTop);
            ele.style.left = left+'px';
            ele.style.top = top+'px';
            ele.style.width = document.documentElement.clientWidth+'px';
            ele.style.height = document.documentElement.clientHeight+'px';
        }

        window.attachEvent("onload", function()
            {            
                var f = window.document.forms[0];
                var originalSubmit = f.onsubmit;
                f.onsubmit = function()
                {                
                    var valid = true;
                    if (originalSubmit) valid = originalSubmit();
                    if (valid) DisableScreen();
                    return valid;
                }
            }
        );
    </script>    
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:DropDownList ID="DropDownList1" runat="server">
            <asp:ListItem>A</asp:ListItem>
            <asp:ListItem>B</asp:ListItem>
            <asp:ListItem>C</asp:ListItem>
        </asp:DropDownList>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
    </div>
    </form>
</body>
</html>

キーの無効化やIE以外の対応などは実装していませんので注意ください。
テストもあまりしていませんのであしらかず。