ASP.NET编程之实现弹窗报警提示浅析


  本文标签:ASP.NET编程 弹窗报警提示

  ASP.NET编程之实现弹窗报警提示的前言,在web应用中,比如OA中,经常要用到一些提示,比如EMAIL到达了,就做个象MSN那样的提示框,弹出给用户提示,然后再关闭  。在asp.net 2.0的ajax中,这个现在不难做到了,刚好看到老外的一篇文章,讲解到,下面小结

  比如有个数据库表,是存放EMAIL的,当数据库表中的EMAIL一有的时候,就提示用户,首先简单写一个WEBSERVICE如下

  以下为引用的内容: 

  1. [ScriptService]  
  2. public class InboxService : System.Web.Services.WebService  
  3. {  
  4. [WebMethod]  
  5. public int GetLatestNumberOfEmails()  
  6. {  
  7. int numberOfEmails = 0;  
  8. using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings[0].ConnectionString))  
  9. {  
  10. using (SqlCommand cmd = new SqlCommand("GetLatestNumberOfEmails", conn))  
  11. {  
  12. cmd.CommandType = CommandType.StoredProcedure;  
  13. conn.Open();  
  14. numberOfEmails = (int)cmd.ExecuteScalar();  
  15. }  
  16. }  
  17. return numberOfEmails;  
  18. }  

  这里要注意要在客户端通过AJAX调用WEBSERICE,要加上[ScriptService]

  ASP.NET编程之实现弹窗报警提示在default.aspx中,首先加入一个updateprogress控件,如下

  以下为引用的内容:

  1. ﹤asp:UpdateProgress DynamicLayout="False" ID="UpdateProgress1" runat="server"﹥  
  2. ﹤ProgressTemplate﹥  
  3. ﹤div id="modal" class="modal"﹥  
  4. ﹤div class="modalTop"﹥  
  5. ﹤div class="modalTitle"﹥My Inbox﹤/div﹥  
  6. ﹤span style="CURSOR: hand" onclick="javascript:HidePopup();"﹥  
  7. ﹤img alt="Hide Popup" src="App_Themes/Default/images/close_vista.gif" border="0" /﹥  
  8. ﹤/span﹥  
  9. ﹤/div﹥  
  10. ﹤div class="modalBody"﹥  
  11. You received ﹤strong﹥﹤span id="modalBody"﹥﹤/span﹥﹤/strong﹥  Email(s).  
  12. ﹤/div﹥  
  13. ﹤/div﹥  
  14. ﹤/ProgressTemplate﹥  
  15. ﹤/asp:UpdateProgress﹥ 

  这里的关闭X按钮,调用javascript的脚本,等阵再说

  然后当然要加scriptmanager控件了,如下

  以下为引用的内容:

  1. ﹤asp:ScriptManager ID="ScriptManager1" runat="server"﹥  
  2. ﹤Services﹥  
  3. ﹤asp:ServiceReference Path="'/InboxService.asmx" /﹥  
  4. ﹤/Services﹥  
  5. ﹤/asp:ScriptManager﹥ 

  这里调用了我们刚才写的webservice

  ASP.NET编程之实现弹窗报警提示:Script

  以下为引用的内容:

  1. ﹤script type="text/javascript"﹥  
  2. var numberOfEmails_original= 0;  
  3.  
  4. var app = Sys.Application;  
  5. app.add_init(applicationInitHandler);  
  6.  
  7. function applicationInitHandler(sender, args) {  
  8. InboxService.GetLatestNumberOfEmails(OnCurrentNumberOfEmailsReady);  
  9. }  

  首先,默认的当然是0封邮件了,有变量来存放当前邮件数量,之后是在ajax中的初始化事件中调用webserice的方法了,并且回调OnCurrentNumberOfEmailsReady方法,

  以下为引用的内容:

  1. function OnCurrentNumberOfEmailsReady(result, userContext, methodName) {  
  2. numberOfEmails_original= result;  
  3. // Start Checking  
  4. StartChecking();  
  5. }   
  6. OnCurrentNumberOfEmailsReady方法将WEBSERVICE调用的结果(当前状态下有多少封信RESULT)返回给变量,然后调用sartchecking()方法  
  7.  
  8. function StartChecking() {  
  9. InboxService.GetLatestNumberOfEmails(OnLastestNumberOfEmailsReady);  
  10. }  
  11.  
  12. startchecking方法,继续回调OnLastestNumberOfEmailsReady方法  
  13.  
  14. function OnLastestNumberOfEmailsReady(result, userContext, methodName) {  
  15. var numberOfEmails_new= result;  
  16. if (numberOfEmails_new ﹥ numberOfEmails_original) {  
  17. ShowPopup();  
  18. $get("modalBody").innerHTML= numberOfEmails_new - numberOfEmails_original;  
  19.  
  20. // Update the count here  
  21. numberOfEmails_original= numberOfEmails_new;  
  22. }  
  23. // Start checking again  
  24. window.setTimeout(StartChecking, 10000);  

  这个方法,用当前邮件数-原来邮件数,就得出新增了多少封邮件了,再将结果赋值给显示区域的modalbody,并且记得把当前邮件数量的,变量更新哦(numberOfEmails_original= numberOfEmails_new;)

  然后再用setimeout来设置每隔10000毫秒检查一次了

  以下为引用的内容:

  1. function ShowPopup() {  
  2. $get("UpdateProgress1").style.visibility= "visible";  
  3. $get("UpdateProgress1").style.display= "block";  
  4. }  
  5. function HidePopup() {  
  6. $get("UpdateProgress1").style.visibility= "hidden";  
  7. $get("UpdateProgress1").style.display= "none";  
  8. }  
  9. ﹤/script﹥ 

  ASP.NET编程之实现弹窗报警提示的相关信息就向你介绍到这里,希望对你有所帮助  。