为使用微软AJAX框架的所有页面添加正在加载的遮罩层效果

如果多个页面使用了微软的AJAX框架，为了统一为所有UpdatePanel添加刷新遮罩效果，可以使用如下代码：

 

protected void Page_LoadComplete(object sender, EventArgs e)
        {

            if (IsAjaxRequest() == false)
            {

                List<UpdatePanel> updatePanels = this.Form.GetAllControls().OfType<UpdatePanel>().ToList();
                string updatePanelsId = "";
                foreach (UpdatePanel panel in updatePanels)
                {
                    updatePanelsId += panel.ClientID + ";";                    
                }
                try
                    {
                        this.Form.Attributes["updatePanelsId"] = updatePanelsId.Trim(';');
                    }
                    catch { }


            }

        }

        /// <summary>
        /// 判断本次请求是否为AJAX请求【微软AJAX框架】
        /// </summary>
        /// <returns></returns>
        protected bool IsAjaxRequest()
        { 
            string micAjaxToken = Page.Request.Headers["X-MicrosoftAjax"];
            string xhrToken = Page.Request.Headers["X-Requested-With"];
            if ("Delta=true".Equals(micAjaxToken) && "XMLHttpRequest".Equals(xhrToken))
            {
                return true;
            }
            return false;
        }

 

$(function () {
    initUpdateProgressPanel();
});

function initUpdateProgressPanel() {


    var updatePanelsId = $("form").attr("updatePanelsId");
    if (updatePanelsId == undefined || updatePanelsId == null || updatePanelsId.length == 0) {
        return;
    }

    updatePanelsId = updatePanelsId.split(';');

    $.each(updatePanelsId, function (i, item) {
        //id="ctl07" class="loadingbox" updatepanelid="UpdatePanel2" style="display: none;"
        var progressPanelId = 'progressPanel' + i;
        var progressPanel = $("<div id='" + progressPanelId + "' class='loadingbox' updatepanelid='" + item + "'><img src='/Images/loading.gif'></div>");
        $("form").append(progressPanel);

        $create(Sys.UI._UpdateProgress, { "associatedUpdatePanelId": item, "displayAfter": 0, "dynamicLayout": true }, null, null, $get(progressPanelId));


        var updatePanel = $("#" + item);
        matchUpdatePanelForProgress(updatePanel, progressPanel);

        updatePanel.resize(function () {
            var progressPanel = $(this).attr("id");
            progressPanel = $("div[updatepanelId='" + progressPanel + "']");
            matchUpdatePanelForProgress($(this), progressPanel);
        });
    });
}

function matchUpdatePanelForProgress(updatePanel, progressPanel) {
    var style = "display:none;opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50);background-color:#aaccff;z-index:9999;position:absolute;width:" + updatePanel.width() + "px;height:" + updatePanel.height() + "px;";
    style = style + "left:" + updatePanel.offset().left + "px;top:" + updatePanel.offset().top + "px;";
    var img = $(progressPanel).find("img");
    var imgMarginLeft = updatePanel.width() / 2 - 80;
    var imgMarginTop = updatePanel.height() / 2 - 10;
    img.attr("style", "margin-left:" + imgMarginLeft + "px;margin-top:" + imgMarginTop + "px");
    $(progressPanel).attr("style", style);
}

 

public static class ControlExtensions
    {
        public static IEnumerable<Control> GetAllControls(this Control ctrl)
        {
            foreach (Control c in ctrl.Controls)
                yield return c;
            foreach (Control c in ctrl.Controls)
                foreach (Control cc in GetAllControls(c))
                    yield return cc;
        }
    }