中国设计秀欢迎投稿
联网
平面设计 画册 VI欣赏 包装 CG-插画 搜索 个人网页 Alexa排名 CSS 建站资源 下载专区 JS特效 品牌服装 服装院校 专题欣赏 SEO 图标欣赏 专题
域名注册 虚拟主机 广州网站设计 域名注册 广州网站建设 上海网站建设 虚拟主机 广州网页设计 签名设计 虚拟主机 域名注册 acg王国 ACG玩家
求创科技
上海网麒科技
中国福网
数字引擎
招聘求职
中国互联
时代互联
中资源
当前位置:网络学院首页 >> 编程开发 >> .net >> 使用AJAX实现弹窗报警代码

使用AJAX实现弹窗报警代码

来源:中国设计秀    作者:    点击:30     加入收藏    发表评论
0
顶一下
中国品牌设计网

    在 web应用,比如OA,经常要用到一些提示,比如EMAIL到达了,就做个象MSN那样的提示框,弹出给用户提示,然后再关闭。在asp.net 2.0的ajax,这个现在不难做到了,下面小结

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

以下为引用的内容:
[ScriptService]
public class InboxService : System.Web.Services.WebService
{
    [WebMethod]
    public int GetLatestNumberOfEmails()
    {
        int numberOfEmails = 0;
        using (SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings[0].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand("GetLatestNumberOfEmails", conn))
            {
                cmd.CommandType = CommandType.StoredProcedure;
                conn.Open();
                numberOfEmails = (int)cmd.ExecuteScalar();
            }
        }
        return numberOfEmails;
    }
}

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

2 在default.aspx,首先加入一个updateprogress控件,如下 .

以下为引用的内容:
<asp:UpdateProgress DynamicLayout="False" ID="UpdateProgress1" runat="server">
    <ProgressTemplate>
        <div id="modal" class="modal">
            <div class="modalTop">
                <div class="modalTitle">My Inbox</div>
                <span style="CURSOR: hand" onclick="javascript:HidePopup();">
                 <img alt="Hide Popup" src="App_Themes/Default/images/close_vista.gif" border="0" />
             </span>
         </div>
            <div class="modalBody">
                You received <strong><span id="modalBody"></span></strong>&nbsp; Email(s).
            </div>
        </div>
    </ProgressTemplate>
    </asp:UpdateProgress>


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

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

以下为引用的内容:

 <asp:ScriptManager ID="ScriptManager1" runat="server">
            <Services>
                <asp:ServiceReference Path="~/InboxService.asmx" />
            </Services>
        </asp:ScriptManager>
 


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

之后是写script了

..

以下为引用的内容:
<script type="text/javascript">
            var numberOfEmails_original= 0;
           
            var app = Sys.Application;
            app.add_init(applicationInitHandler);
           
            function applicationInitHandler(sender, args) {
                InboxService.GetLatestNumberOfEmails(OnCurrentNumberOfEmailsReady);
.

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

以下为引用的内容:
     function OnCurrentNumberOfEmailsReady(result, userContext, methodName) {
                numberOfEmails_original= result;
                // Start Checking
                StartChecking();
            }
OnCurrentNumberOfEmailsReady方法将WEBSERVICE调用的结果(当前状态下有多少封信RESULT)返回给变量,然后调用sartchecking()方法

      function StartChecking() {
          InboxService.GetLatestNumberOfEmails(OnLastestNumberOfEmailsReady);
      }

startchecking方法,继续回调OnLastestNumberOfEmailsReady方法

 

            function OnLastestNumberOfEmailsReady(result, userContext, methodName) {
                var numberOfEmails_new= result;
                if (numberOfEmails_new > numberOfEmails_original) {
                    ShowPopup();
                     $get("modalBody").innerHTML= numberOfEmails_new - numberOfEmails_original;
                   
                    // Update the count here


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

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

以下为引用的内容:

            function ShowPopup() {
                 $get("UpdateProgress1").style.visibility= "visible";
                 $get("UpdateProgress1").style.display= "block";
            }
            function HidePopup() {
                 $get("UpdateProgress1").style.visibility= "hidden";


                 $get("UpdateProgress1").style.display= "none";
            }
        </script>

 

2007-07-31 10:40:00    出处:
热点文章/相关文章
网站地图 | 关于我们 | 联系我们 | 网站建设 | 广告服务 | 版权声明 | 免责声明 | 网站公告 | 友情链接 | 留言 | 旧版入口