ASP.NET后台执行网页显示等待中方法

SongKer 发布时间:2014-07-14 分类:.NET 阅读:4988次 添加评论

三种处理方法:使用到UpdatePanel控件,JS弹出层,以及弹出处理页。基本方法一样,实现的方式不一样。第一种方法是用到UpdatePanel,需要VS2008以上的支持。下面是方法及代码:

第一种:使用到UpdatePanel控件,将JS代码放在ContentPlaceHolder 下面(具体代码:http://msdn.microsoft.com/zh-cn/library/bb311028.aspx),可将该方法应用到MasterPage模板页。

if (typeof Sys != "undefined") {
    Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(
                  function (sender, e) {
                      $("#loading").show();
                  }
               );
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
       function (sender, e) {
           UpdateAudit();
           $("#loading").hide();
       }
    )
}
function UpdateAudit() {
    $(document).ready(function () {
        $.ajax({
            url: "../../ASHX/getAuditNum.ashx",
            async: false,
            type: "POST",
            success: function (data) {
                
                var auditnum = document.parentWindow.parent.banner.document.getElementById("auditnum");
                if (auditnum != null) {
                    if (data != "") {
                        auditnum.innerText = data
                    }
                }
            },
            error: function () { alert("error"); }
        });
    });
}

HTML代码:

<div id="loading" style="display: none; width: 100px; height: 40px; margin: -20px 0 0 -50px; text-align: center; position: absolute; top: 50%; left: 50%">
       <img src="../../Images/loading2.gif" width="25" style="float: left;" />
       <span style="line-height: 30px;color:SeaGreen; font-weight: bold;">正在处理中..</span>
</div>

第二种方法:可以做个公用的用户控件,copy如下html代码。后台有处理时调用相应JS方法隐藏或显示弹出层。

<div id='doing' style='Z-INDEX: 12000; LEFT: 0px; WIDTH: 100%; CURSOR: wait; POSITION: absolute; TOP: 0px; HEIGHT: 100%'>
    <table width='100%' height='100%' id="Table1">
        <tr align='center' valign='middle'>
            <td >
                <table id="Table2" class="loading">
                    <tr align='center' valign='middle'>
                        <td>Loading...</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</div>
<script language="javascript">
    function ShowWaiting()
    {
        document.getElementById('doing').style.visibility = 'visible';
    }
    function CloseWaiting()
    {
        document.getElementById('doing').style.visibility = 'hidden';
    }
    function MyOnload()
    {
        document.getElementById('doing').style.visibility = 'hidden';
    }
    if (window.onload == null)
    {
        window.onload = MyOnload;
    }
</script>

2。在页面中拖入用户控件

3。在页面中给button加客户端click方法,如下。也可以在前台直接添加onclick属性

protected void Page_Load(object sender, EventArgs e)
{
    this.Button1.Attributes.Add("onclick", "ShowWaiting();"); 
}

第三种方法:与上面类似,将弹出层改为弹出一个处理页面processwin.aspx。

第一个页面比如first.aspx加入以下js:

<script language="javascript">
    var _tt;
    function showSending() 
    {
        _tt=window.open("processwin.aspx",'uploadfileprocess',"toolbar=0,location=0,directories=0,status=0,
        menubar=0,scrollbars=1,resizable=1,top=" dispHeight ",left=" dispWidth ",width=410,height=200",true); 
        return true;
    }
    function closewin()
    {
        if (_tt!=null)
        {
            _tt.close();
        }
    }
</script>
<body bgColor="silver" onunload="closewin();">

然后,后台代码first.aspx.cs

page_load()时,检索按钮加入如下属性:

btFileUpload.Attributes.Add("onclick","return showSending()");

processwin.aspx页面就是你要的中间页了,上面写上“等待...”或者“loading..”



关键字词: ASP.NET等待中

暂无留言

发表评论:

◎欢迎您的参与讨论。