|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Announcements
Chapters
Services
Feature Zones
|
Note: This is an unedited contribution. If this article is inappropriate,
needs attention or copies someone else's work without reference then please
Report This Article
IntroductionMicrosoft Ajax 1.0 has just been released! (http://go.microsoft.com/fwlink/?LinkID=77296). In syncronous web forms it's easier to interact with the user, because he/she sees the page flashing back and processing (which is undesirable). With Ajax, you can add an update progress panel, and put an animated gif inside. But what if you want to display an hourglass? In this article I will show 2 tricks. Diplay an hourglassThe following javascript code snippet nicely does the job: <scriptmanager id="ScriptManager1" runat="server" /> <script language="JavaScript"> var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_initializeRequest(InitializeRequest); prm.add_endRequest(EndRequest); function InitializeRequest(sender, args) { document.body.style.cursor = "wait"; } function EndRequest(sender, args) { document.body.style.cursor = "default"; } </script> I have received several criticism due to the length of this article, so I have decided to rename it as: some Ajax tips & tricks. Click-once button controlLots of attempts have been made to create a click once button...Some of them are quite complex (http://www.codeproject.com/aspnet/ClickOnce_Button_Control.asp). <scriptmanager id="ScriptManager1" runat="server" /> <script language="JavaScript"> var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_initializeRequest(InitializeRequest); prm.add_endRequest(EndRequest); var btn; function InitializeRequest(sender, args) { document.body.style.cursor = "wait"; var btnId=args._postBackElement.id; btn= document.getElementById(btnId); if (btn.type=="button" || btn.type=="submit") btn.disabled=true; } function EndRequest(sender, args) { document.body.style.cursor = "default"; if(btn!=null) btn.disabled=false; } </script> Code explanation: In the InitializeRequest function we retrieve the pressed button id, by retrieving the _postBackElement which is passed as an argument, and after we verify if it is a button. Note that the above function will work ONLY if the button control is inside an UpdatePanel. And that's it! We have a click-once button! We can even put it in a MasterPage to propagate behavior to your content pages...
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||