熱點推薦：
您现在的位置： 電腦知識網 >> 編程 >> .NET編程 >> 正文

Loading控件：防止用戶反復提交

2022-06-13   來源: .NET編程 

　　Web系統中經常會遇到這樣的情況頁面提交很慢用戶耐心受到挑戰就開始摧殘頁面上的按鈕反復點擊反而搞得更慢前兩天就遇到這樣一個問題用戶要進行大數據量的導出操作這個服務器端需要比較長的時間處理於是很容易出現用戶等得不耐煩就反復點擊導出按鈕的情況

　　比較簡單的解決方法就是在用戶進行了點擊操作將按鈕之類的東西隱藏掉國外的一位同行寫了一個對button的擴展pleasewaitButton 源文檔 <; 就是實現了這個效果但是這個控件是有局限的有時候要隱藏的不只是按鈕我覺得可以學習UpdatePanel的包起來一個區域的方式以獲得更大的靈活性

　　下面是頁面代碼的一個示例          <%@ Page Language=C# AutoEventWireup=true CodeFile=Defaultaspxcs Inherits=_Default %>
        <%@ Register Assembly=KingWebControlToolkit Namespace=KingWebControlToolkit TagPrefix=King %>
        <!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
        <html xmlns=>
        <head runat=server>
            <title>Untitled Page</title>
        </head>
        <body>
            <form id=form runat=server>
                <div>
                    <King:LoadingControl runat=server>
                        <ContentTemplate>
                            <asp:Button ID=Button runat=server Text=Button />
                        </ContentTemplate>
                        <ProgressTemplate>
                            <img src=loadergif />Loading
                        </ProgressTemplate>
                    </King:LoadingControl>
                </div>
            </form>
        </body>
        </html>

　　為了能看到Loading的效果我們在Page_Load中使用SystemThreadingThreadSleep();做延遲

　　頁面render出來的代碼如下          <!DOCTYPE html PUBLIC //WC//DTD XHTML Transitional//EN transitionaldtd>
        <html xmlns=>
        <head><title>
            Untitled Page
        </title></head>
        <body>
            <form name=form method=post action=defaultaspx id=form>
        <div>
        <input type=hidden name=__VIEWSTATE id=__VIEWSTATE value=/wEPDwULLTEzMTANTMNzBkZLrTZqXsuouOmVoeCXorqEigxmz />
        </div>
                <div>
                    <span><span onclick=javascript:thisstyledisplay=none;documentgetElementById(progress)styledisplay=; id=content>
                            <input type=submit name=ctl$Button value=Button id=ctl_Button />
                        </span><span id=progress >
                            <img src=loadergif />Loading
                        </span></span>
                </div>
        <div>
            <input type=hidden name=__EVENTVALIDATION id=__EVENTVALIDATION value=/wEWAgLdPGLAgLbhbjtDTVNGhBUNrcMhkjWUdhLBytV />
        </div></form>
        </body>
        </html>

　　控件實現

　　其實就兩個要點

　　控件要支持兩個模板一個是ContentTemplate這個是要隱藏部分的模板一個是Progress模板用來放Loading的提示信息添加javascript腳本來實現隱藏這個利用事件傳遞的原理可以方便的實現這個控件超簡單直接貼代碼了控件源代碼如下

　　using System;
        using SystemComponentModel;
        using SystemDrawing;
        using SystemSecurityPermissions;
        using SystemWeb;
        using SystemWebUI;
        using SystemWebUIWebControls;
        namespace KingWebControlToolkit
        {
            [
            AspNetHostingPermission(SecurityActionInheritanceDemand
                Level = AspNetHostingPermissionLevelMinimal)
            AspNetHostingPermission(SecurityActionDemand
                Level = AspNetHostingPermissionLevelMinimal)
            ToolboxData(
                <{}:LoadingControl runat=\server\> </{}:LoadingControl>)
            ]
            public class LoadingControl : CompositeControl
            {
                private ITemplate contentTempalte;
                private ITemplate progressTemplate;
                private TemplateContainer contentContainer;
                private TemplateContainer progressContainer;
                [
                Browsable(false)
                DesignerSerializationVisibility(
                    DesignerSerializationVisibilityHidden)
                ]
                public TemplateContainer Owner
                {
                    get
                    {
                        return contentContainer;
                    }
                }
                [
                Browsable(false)
                PersistenceMode(PersistenceModeInnerProperty)
                DefaultValue(typeof(ITemplate) )
                Description(Control template)
                TemplateContainer(typeof(LoadingControl ))
                ]
                public virtual ITemplate ContentTemplate
                {
                    get
                    {
                        return contentTempalte;
                    }
                    set
                    {
                        contentTempalte = value;
                    }
                }
                [
                Browsable(false)
                PersistenceMode(PersistenceModeInnerProperty)
                DefaultValue(typeof(ITemplate) )
                Description(Control template)
                TemplateContainer(typeof(LoadingControl))
                ]
                public virtual ITemplate ProgressTemplate
                {
                    get
                    {
                        return progressTemplate;
                    }
                    set
                    {
                        progressTemplate = value;
                    }
                }
                protected override void CreateChildControls()
                {
                    ControlsClear();
                    contentContainer = new TemplateContainer();
                    progressContainer = new TemplateContainer();
                    contentContainerAttributes[onclick] = javascript:thisstyledisplay=none;documentgetElementById(progress)styledisplay=;;
                    contentContainerAttributes[id] = content;
                    progressContainerAttributes[id] = progress;
                    progressContainerAttributes[style] = display:none;
                    ITemplate temp = contentTempalte;
                    if (temp == null)
                    {
                        temp = new DefaultTemplate();
                    }
                    tempInstantiateIn(contentContainer);
                    temp = progressTemplate;
                    tempInstantiateIn(progressContainer);
                    thisControlsAdd(contentContainer);
                    thisControlsAdd(progressContainer);
                }
            }
            [
            ToolboxItem(false)
            ]
            public class TemplateContainer : WebControl
            {
            }
            DefaultTemplate
        }


From:http://tw.wingwit.com/Article/program/net/201311/13979.html
    《Loading控件：防止用戶反復提交》本文是由.NET編程免費提供，內容來源於互聯網,本文歸原作者所有。
  • 上一篇文章：

  • 下一篇文章：
    • 相關文章
    主板 CPU 硬盤 內存 顯卡 聲卡 顯示器 光驅 死機
    推薦文章
    Copyright © 2005-2022 電腦知識網 Computer Knowledge   All rights reserved.