网站导航网学 原创论文 原创专题 网站设计 最新系统 原创论文 论文降重 发表论文 论文发表 UI设计定制 论文答辩PPT格式排版 期刊发表 论文专题
返回网学首页
网学原创论文
最新论文 推荐专题 热门论文 论文专题
当前位置: 网学 > 设计资源 > .Net编程 > 正文

Ajax与WCF完美交互(附源码下载)

论文降重修改服务、格式排版等 获取论文 论文降重及排版 论文发表 相关服务

 

第一步: 在vs2008中创建一个网站. (源码下载)

在vs2008中,创建网站时候如果选择.Net Framework 3.5的模板,那么创建好的项目中web.config中自动带有ajax的配置.这个在上文中说过.而且在右面的工具箱中也有Ajax控件栏

但如果创建的.net framework 2.0的网站默认情况下web.config中是不支持ajax的.但也有解决办法,下文再说.

第二步: 创建一个可用于ajax交互的wcf服务AjaxWcfService.svc,方式如下:

修改模板产生的服务代码如下:

 

  1. [OperationContract]  
  2.  
  3. public int IntAdd(int a,int b)  
  4.  
  5. {  
  6.  
  7. // 在此处添加操作实现  
  8.  
  9. return a+b;  
  10.  
  11. }  

 

在浏览器中浏览AjaxWcfService.svc,会出现下面的效果:

第三步: 好,下面一个步骤和原来的xml web service与ajax交互使用方法不太一致.步骤如下 :
访问第二步打开的AjaxWcfService.svc网址后面添加/js的网址,如图所示:

哈哈,这样便能下载到用于访问wcf服务的js代理.将该文件保存起来,我这里命名为AjaxWcfScript.js,然后将其添加到项目的根目录中(其他位置也可,位置自选) .
第四步:到第三步结束,与WCF相关的操作基本已经完成,下面进行的是ajax的开发.
在default.aspx中添加scriptmanager从右面的工具箱中拖一个ScriptManager的控件到default.aspx中,然后添加ScriptReference,完成后的ScriptManager代码如下:

  1. <asp:ScriptManager ID="ScriptManager1" runat="server">  
  2.  
  3. <Scripts>  
  4.  
  5. <asp:ScriptReference Path="~/AjaxWcfScript.js" />  
  6.  
  7. </Scripts>  
  8.  
  9. </asp:ScriptManager>  

 

第五步: 第四步基本实现页面default.aspx对scriptmanager的支持,并且添加了访问WCF服务AjaxWcfService.svc的配置,下面的过程就非常easy了,在default.aspx中添加如下的element 

  1. <h2>ajax与wcf交互示例</h2>  
  2.  
  3. <p>a:<input id="txtA" type="text" /></p>  
  4.  
  5. <p>b:<input id="txtB" type="text" /></p>  
  6.  
  7. <input id="Button1" type="button" value="提交" />  

 

然后在<head></head>中添加如下的脚本script 

  1. <script type="text/javascript">  
  2.  
  3. function intAdd()  
  4.  
  5. {  
  6.  
  7. var a = $get("txtA").value;  
  8.  
  9. var b = $get("txtB").value;  
  10.  
  11. AjaxWcfService.IntAdd(a,b,onSuccess,onFailed);  
  12.  
  13. }  
  14.  
  15. function onSuccess(res)  
  16.  
  17. {  
  18.  
  19. alert(res);  
  20.  
  21. }  
  22.  
  23. function onFailed(res)  
  24.  
  25. {  
  26.  
  27. alert(res);  
  28.  
  29. }  
  30.  
  31. </script>  

 

然后将Button1的onclick指定为intAdd

  1. <input id="Button1" type="button" value="提交" onclick="intAdd()"/> 

 

第六步: 好,现在万事俱备,只欠测试了,在浏览器中浏览default.aspx,随便在输入框中输入连个数字,点击提交,结果如下:

好,一个perfect的ajax与wcf到此结束.

  • 上一篇资讯: 推荐web中用到的编辑器
  • 设为首页 | 加入收藏 | 网学首页 | 原创论文 | 计算机原创
    版权所有 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
    Copyright 2008-2020 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号 常年法律顾问:王律师