A button control written by myself. When clicked, a loading mask layer is displayed on the interface.

Imports system. collections. generic <br/> imports system. componentmodel <br/> imports system. text <br/> imports system. web <br/> imports system. web. ui <br/> imports system. web. UI. webcontrols <br/> namespace web. controls <br/> ''' <summary> <br/> ''' represents a button to prevent duplicate submissions. <br/> ''' when the user clicks the button after the button is grayed out, can not click again until relo Ad the page or jump. <br/> ''' </Summary> <br/> <defaultproperty ("text") >_< br/> <toolboxdata ("<{0 }: clickoncebutton runat = Server> </{0}: clickoncebutton> ") >_< br/> public class clickoncebutton <br/> inherits system. web. UI. webcontrols. button <br/> ''' <summary> <br/> ''' the default constructor. <br/> ''' </Summary> <br/> Public sub new () <br/> me. viewstate ("aftersubmittext") = "submitting, please w AIT... "<br/> mybase. TEXT = "clickoncebutton" <br/> me. viewstate ("showmessagebox") = false <br/> me. viewstate ("showloadinglayer") = false <br/> me. viewstate ("warningtext") = "sure to submit it? "<Br/> end sub <br/> ''' <summary> <br/> ''' gets or sets the click of a button, the button on the display text. <br/> ''' </Summary> <br/> <Bindable (true), category ("appearance"), defaultvalue ("submitting, please wait... "), description (" after the submission instructions click the button on the display text. ") >_< br/> Public Property aftersubmittext () as string <br/> Get <br/> dim aftersubmittex T _ 1 as string = directcast (Me. viewstate ("aftersubmittext"), string) <br/> If aftersubmittext _ 1 isnot nothing then <br/> return aftersubmittext _ 1 <br/> else <br/> return string. empty <br/> end if <br/> end get <br/> set (byval value as string) <br/> me. viewstate ("aftersubmittext") = value <br/> end set <br/> end property <br/> <Bindable (true), category ("appearance "), defaultvalue (false), descript Ion ("indicates whether to display a prompt box. ") >_< br/> Public Property showloadinglayer () as Boolean <br/> Get <br/> return cbool (Me. viewstate ("showloadinglayer") <br/> end get <br/> set (byval value as Boolean) <br/> me. viewstate ("showloadinglayer") = value <br/> end set <br/> end property <br/> <Bindable (true), category ("appearance "), defaultvalue (false), description ("indicates whether to Di Splay a prompt box. ") >_< br/> Public Property showmessagebox () as Boolean <br/> Get <br/> return cbool (Me. viewstate ("showmessagebox") <br/> end get <br/> set (byval value as Boolean) <br/> me. viewstate ("showmessagebox") = value <br/> end set <br/> end property <br/> <Bindable (true), category ("appearance "), defaultvalue ("sure to submit it? "), Description (" instructions ined in the contents of the prompt box. ") >_< br/> Public Property warningtext () as string <br/> Get <br/> return directcast (Me. viewstate ("warningtext"), string) <br/> end get <br/> set (byval value as string) <br/> me. viewstate ("warningtext ") = value <br/> end set <br/> end property <br/> ''' <summary> <br/> ''' </Summary> <br/> ''' <Param name = "Writer"> htmltextwriter </param> <br/> protected overrides sub addattributestorender (byval writer as htmltextwriter) <br/> dim clientsideeventreference as new system. text. stringbuilder () <br/> If (Me. page isnot nothing) andalso me. causesvalidation) andalso (Me. page. validators. count> 0) Then <br/> clientsideeventreference. append ("If (typeof (page_clientvalidate) = 'function') {If (page _ Clientvalidate () = false) {return false ;}} ") <br/> end if <br/> 'showmessagebox? <Br/> if me. showmessagebox then <br/> clientsideeventreference. append ("If (! Confirm ('"& me. warningtext & "') {return false}") <br/> end if <br/> if me. showloadinglayer then <br/> clientsideeventreference. append ("Var objimg = document. createelement ("" IMG ""); ") <br/> clientsideeventreference. append ("objimg. src = "" images/loadingcontent.gif ""; ") <br/> clientsideeventreference. append ("Var imsk = document. createelement ("" Div ""); ") <br/> clientsideeventreference. append ("document. body. appendchild (imsk); ") <br/> clientsideeventreference. append ("imsk. id = "" Mask ""; ") <br/> clientsideeventreference. append ("imsk. style. position = "" absolute ""; ") <br/> clientsideeventreference. append ("imsk. style. zindex = "" 1 ""; ") <br/> clientsideeventreference. append ("imsk. style. width = "" 100% ""; ") <br/> clientsideeventreference. append ("imsk. style. height = "" 100% ""; ") <br/> clientsideeventreference. append ("imsk. style. align = "" center ""; ") <br/> clientsideeventreference. append ("imsk. style. top = "" 0px ""; ") <br/> clientsideeventreference. append ("imsk. style. left = "" 0px ""; ") <br/> clientsideeventreference. append ("imsk. style. background = "" #000 ""; ") <br/> clientsideeventreference. append ("imsk. style. filter = "" alpha (opacity = 30) ""; ") <br/> clientsideeventreference. append ("imsk. style. opacity = "" 0.30 ""; ") <br/> clientsideeventreference. append ("imsk. appendchild (objimg); ") <br/> clientsideeventreference. append ("Var Height = document. body. scrollheight; ") <br/> clientsideeventreference. append ("Var width = document. body. scrollwidth; ") <br/> clientsideeventreference. append ("If (objimg. readystate = "" complete "") {") <br/> clientsideeventreference. append ("objimg. style. margintop = (height-objimg. offsetheight)/2 + "" PX ""; ") <br/> clientsideeventreference. append ("objimg. style. marginleft = (width-objimg. offsetwidth)/2 + "" PX ""; ") <br/> clientsideeventreference. append ("}") <br/> clientsideeventreference. append ("objimg. style. position = "" absolute ""; ") <br/> end if <br/> clientsideeventreference. appendformat ("this. value = '{0}'; ", directcast (Me. viewstate ("aftersubmittext"), string) <br/> clientsideeventreference. append ("this. disabled = true; ") <br/> clientsideeventreference. append (Me. page. clientscript. getpostbackeventreference (Me, String. empty) <br/> writer. addattribute (htmltextwriterattribute. onclick, clientsideeventreference. tostring (), true) <br/> mybase. addattributestorender (writer) <br/> end sub <br/> end class <br/> end namespace

 

Clientsideeventreference. append ("objimg. src =" "images/loadingcontent.gif "";")

This is the loading GIF image in the images folder under the root directory of the website.

This control is modified based on a single-click button written by someone else on the Internet. It is more practical.

The function of clicking a button at a time is that when you click submit, the button becomes grayed out to prevent users from clicking it again when the submission is incomplete. But this

Control defects are also obvious. If you do not click this button, you can still click other controls on the interface.

The solution is to bring up a mask layer to completely isolate user operations on the interface.

 

Note that after an IMG element is dynamically created, you must wait for it to be loaded to determine its size, that is, the image.

Slice loaded

If (objimg. readystate = "complete" <br/>{< br/> // the size of IMG can be obtained here <br/>}