jquery调用wcf并展示出数据的方法


Posted in Javascript onJuly 07, 2011

首选创能wcf,代码很简单,如下:

using System; 
using System.Data; 
using System.ServiceModel; 
using System.ServiceModel.Activation; 
using System.ServiceModel.Web; 
using System.Web.Script.Services; [ServiceContract(Namespace = "")] 
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] 
[ServiceBehavior(IncludeExceptionDetailInFaults = true)] 
public class imgService 
{ 
// 要使用 HTTP GET,请添加 [WebGet] 特性。(默认 ResponseFormat 为 WebMessageFormat.Json) 
// 要创建返回 XML 的操作, 
// 请添加 [WebGet(ResponseFormat=WebMessageFormat.Xml)], 
// 并在操作正文中包括以下行: 
// WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml"; 
[OperationContract] 
[WebGet(RequestFormat=WebMessageFormat.Json,ResponseFormat=WebMessageFormat.Json)] 
//[WebInvoke(Method = "GET", RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json,BodyStyle = WebMessageBodyStyle.WrappedRequest)] 
public DataTable GetDataTable(string pz) 
{ 
// 在此处添加操作实现 
DataSet ds = WebBase.GetDS(WebBase.meinvRepository, string.Empty, " body_id desc",pz); 
if (ds.Tables.Count > 0) 
return ds.Tables[0]; 
return null; 
} 
// 在此处添加更多操作并使用 [OperationContract] 标记它们 
}

说明一下,wcf就一个GetDataTable方法,有一个参数pz表示返回数据的行数,返回的table以json数据给jquery使用

页面调用方法也很简单:

<%@ Page Language="C#" EnableViewState="false" AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits="jquerywcf_Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
<title></title> 
<script src="../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div class="main"> 
<ul><li><a></a></li></ul> 
</div> 
<div> 
<script type="text/javascript"> 
function sendAJAX(data) { 
var url = "<%=_url %>imgService.svc/GetDataTable"; $.getJSON(url, { pz: "6" }, function (msg) { 
$(msg.d).find("Table").each(function (i) { 
var rq = $(this).children("Body_AddTime").text().split('T')[0].replace("-", "").replace("-", ""); 
rq = rq.substring(0, rq.length - 2); 
var html = '<li><a href="http://meinv.vs2010.com/topic/' + $(this).children("Body_MuLuID").text() + '/' + rq + '/show-id' + $(this).children("Body_ID").text() + '.html" target="_blank"><img src="http://meinv.vs2010.com/' + $(this).children("Body_Tu").text() + '" />' + $(this).children("Body_Name").text() + '</a></li>'; 
$(".main ul").append(html); 
}); 
}); 
} 

$(function () { 
sendAJAX(); 
}); 
</script> 
<div id="msg"> 
</div> 
</div> 
</form> 
</body> 
</html>

说明一下,主要是通过jquery的getjson方法去取得wcf返回的数据,传参方法:

$.getJSON(url, { pz: "6" }, function (msg) {alert(msg.d)});这里是返回6条数据还有wcf的svc上加上属性:
Factory=System.ServiceModel.Activation.WebScriptServiceHostFactory还有web.config的配置:

<?xml version="1.0"?> 
2 <configuration> 
3 
4 <configSections> 
5 <!--ajax--> 
6 <sectionGroup name="ajaxNet"> 
7 <section name="ajaxSettings" type="AjaxPro.AjaxSettingsSectionHandler,AjaxPro.2" requirePermission="false" restartOnExternalChanges="true"/> 
8 </sectionGroup> 
9 <!--ajax--> 
<sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"> 
<sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"> 
<section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication"/> 
<sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"> 
<section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="Everywhere" /> 
<section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" /> 
<section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" /> 
<section name="roleService" type="System.Web.Configuration.ScriptingRoleServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" /> 
</sectionGroup> 
</sectionGroup> 
</sectionGroup> 
</configSections> 
<appSettings/> 
<connectionStrings> 
<add name="meinvvs2010ConnectionString" connectionString="server=127.0.0.1;user id=test; password=test; database=test;pooling=false" providerName="MySql.Data.MySqlClient"/> 
</connectionStrings> 
<!--ajax--> 
<ajaxNet> 
<ajaxSettings> 
<urlNamespaceMappings useAssemblyQualifiedName="false" allowListOnly="false"/> 
<jsonConverters includeTypeProperty="true"/> 
<debug enabled="false"/> 
<token enabled="false" sitePassword="password"/> 
</ajaxSettings> 
</ajaxNet> 
<location path="ajaxpro" allowOverride="true" inheritInChildApplications="false"> 
<system.web> 
<globalization requestEncoding="utf-8" responseEncoding="utf-8" fileEncoding="utf-8"/> 
<!--for iis7 
<system.webServer> 
<handlers> 
<add verb="*" path="*.ashx" name="AjaxPro" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/> 
</handlers> 
</system.webServer>--> 
<!--for iis6--> 
<httpHandlers> 
<add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/> 
</httpHandlers> 
</system.web> 
</location> 
<!--ajax--> 
<system.web> 
<customErrors mode="Off"/> 
<compilation debug="true"> 
<assemblies> 
<add assembly="System.Core, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/> 
<add assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add assembly="System.Data.DataSetExtensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/> 
<add assembly="System.Xml.Linq, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/> <add assembly="System.ServiceModel, Version=3.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089"/> 
<add assembly="System.ServiceModel.Web, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
</assemblies> 
<buildProviders> 
<remove extension=".svc"/> 
<add extension=".svc" type="System.ServiceModel.Activation.ServiceBuildProvider,System.ServiceModel, Version=3.0.0.0, Culture=neutral,PublicKeyToken=b77a5c561934e089"/> 
</buildProviders> 
</compilation> 

<!-- 
通过 <authentication> 节可以配置 
安全身份验证模式,ASP.NET 
使用该模式来识别来访用户身份。 
--> 
<authentication mode="Windows" /> 
<!-- 
如果在执行请求的过程中出现未处理的错误, 
则通过 <customErrors> 节 
可以配置相应的处理步骤。具体而言, 
开发人员通过该节可配置要显示的 html 错误页, 
以代替错误堆栈跟踪。 
<customErrors mode="RemoteOnly" defaultRedirect="GenericErrorPage.htm"> 
<error statusCode="403" redirect="NoAccess.htm" /> 
<error statusCode="404" redirect="FileNotFound.htm" /> 
</customErrors> 
--> 
<pages> 
<controls> 
<add tagPrefix="asp" namespace="System.Web.UI" assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add tagPrefix="asp" namespace="System.Web.UI.WebControls" assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
</controls> 
</pages> 
<httpHandlers> 
<remove verb="*" path="*.asmx"/> 
<add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false"/> 
</httpHandlers> 
<httpModules> 
<add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add name="ServiceModel" type="System.ServiceModel.Activation.HttpModule, System.ServiceModel, Version=3.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089"/> 
</httpModules> 
</system.web> 
<system.codedom> 
<compilers> 
<compiler language="c#;cs;csharp" extension=".cs" warningLevel="4" 
type="Microsoft.CSharp.CSharpCodeProvider, System, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089"> 
<providerOption name="CompilerVersion" value="v3.5"/> 
<providerOption name="WarnAsError" value="false"/> 
</compiler> 
<compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" warningLevel="4" 
type="Microsoft.VisualBasic.VBCodeProvider, System, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089"> 
<providerOption name="CompilerVersion" value="v3.5"/> 
<providerOption name="OptionInfer" value="true"/> 
<providerOption name="WarnAsError" value="false"/> 
</compiler> 
</compilers> 
</system.codedom> 
<!-- 
system.webServer 节是在 Internet Information Services 7.0 下运行 ASP.NET AJAX 
所必需的。对早期版本的 IIS 来说则不需要此节。 
--> 
<system.webServer> 
<validation validateIntegratedModeConfiguration="false"/> 
<urlCompression doStaticCompression="true" doDynamicCompression="true"/> 
<httpErrors errorMode="Detailed" /> 
<asp scriptErrorSentToBrowser="true"/> 

<modules> 
<remove name="ScriptModule" /> 
<add name="ScriptModule" preCondition="managedHandler" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
</modules> 
<handlers> 
<remove name="WebServiceHandlerFactory-Integrated"/> 
<remove name="ScriptHandlerFactory" /> 
<remove name="ScriptHandlerFactoryAppServices" /> 
<remove name="ScriptResource" /> 
<remove name="svc" /> 
<add name="svc" path="*.svc" verb="*" type="System.ServiceModel.Activation.HttpHandler, System.ServiceModel, Version=3.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" preCondition="integratedMode" /> 
<add verb="*" path="*.ashx" name="AjaxPro" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/> 
<add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode" 
type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode" 
type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/> 
<add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
</handlers> 
</system.webServer> 
<runtime> 
<assemblyBinding appliesTo="v2.0.50727" xmlns="urn:schemas-microsoft-com:asm.v1"> 
<dependentAssembly> 
<assemblyIdentity name="MySql.Data" publicKeyToken="C5687FC88969C44D"/> 
<!--<bindingRedirect oldVersion="5.0.7.0" newVersion="6.3.2.0"/>--> 
<bindingRedirect oldVersion="5.0.7.0" newVersion="6.2.3.0"/> 
</dependentAssembly> 
<dependentAssembly> 
<assemblyIdentity name="System.Web.Extensions" publicKeyToken="31bf3856ad364e35"/> 
<bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/> 
</dependentAssembly> 
<dependentAssembly> 
<assemblyIdentity name="System.Web.Extensions.Design" publicKeyToken="31bf3856ad364e35"/> 
<bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/> 
</dependentAssembly> 
</assemblyBinding> 
</runtime> 
<system.serviceModel> 
<behaviors> 
<endpointBehaviors> 
<behavior name="imgServiceAspNetAjaxBehavior"> 
<enableWebScript /> 
</behavior> 
</endpointBehaviors> 
</behaviors> 
<serviceHostingEnvironment aspNetCompatibilityEnabled="true" > 
<baseAddressPrefixFilters> 
<!--<add prefix="http://demo.vs2010.com"/>--> 
</baseAddressPrefixFilters> 
</serviceHostingEnvironment> 
<services> 
<service name="imgService"> 
<endpoint address="" behaviorConfiguration="imgServiceAspNetAjaxBehavior" 
binding="webHttpBinding" contract="imgService" /> 
</service> 
</services> 
</system.serviceModel> 
</configuration>

好的,成功!上传到gd空间试试 :)
Javascript 相关文章推荐
js 面向对象的技术创建高级 Web 应用程序
Feb 25 Javascript
js下获取div中的数据的原理分析
Apr 07 Javascript
Javascript this 的一些学习总结
Aug 31 Javascript
JavaScript位置与大小(1)之正确理解和运用与尺寸大小相关的DOM属性
Dec 26 Javascript
JS获取屏幕高度的简单实现代码
May 24 Javascript
AngularJS入门教程之表格实例详解
Jul 27 Javascript
JavaScript实现经典排序算法之选择排序
Dec 28 Javascript
详解使用VueJS开发项目中的兼容问题
Aug 02 Javascript
微信小程序在线客服自动回复功能(基于node)
Jul 03 Javascript
微信小程序 this.triggerEvent()的具体使用
Dec 10 Javascript
Javascript Symbol原理及使用方法解析
Oct 22 Javascript
javascript实现固定侧边栏
Feb 09 Javascript
基于json的jquery地区联动效果代码
Jul 06 #Javascript
JQury slideToggle闪烁问题及解决办法
Jul 05 #Javascript
jquery中通过过滤器获取表单元素的实现代码
Jul 05 #Javascript
jquery中获取元素的几种方式小结
Jul 05 #Javascript
JavaScript 判断日期格式是否正确的实现代码
Jul 04 #Javascript
Javascript计算时间差的函数分享
Jul 04 #Javascript
ajax 同步请求和异步请求的差异分析
Jul 04 #Javascript
You might like
PHP命名空间(Namespace)简明教程
2014/06/11 PHP
php微信浏览器分享设置以及回调详解
2016/08/01 PHP
PHP echo()函数讲解
2019/02/15 PHP
一实用的实现table排序的Javascript类库
2007/09/12 Javascript
js 第二代身份证号码的验证机制代码
2011/05/12 Javascript
在新窗口打开超链接的方法小结
2013/04/14 Javascript
快速查找数组中的某个元素并返回下标示例
2013/09/03 Javascript
基于OL2实现百度地图ABCD marker的效果
2015/10/01 Javascript
Express的路由详解
2015/12/10 Javascript
使用JS代码实现点击按钮下载文件
2016/11/12 Javascript
jquery dataview数据视图插件使用方法
2016/12/23 Javascript
JS原生轮播图的简单实现(推荐)
2017/07/22 Javascript
JavaScript 中的 this 工作原理
2018/06/20 Javascript
用Python编写一个每天都在系统下新建一个文件夹的脚本
2015/05/04 Python
轻松掌握python设计模式之策略模式
2016/11/18 Python
小米5s微信跳一跳小程序python源码
2018/01/08 Python
谈谈python中GUI的选择
2018/03/01 Python
python批量获取html内body内容的实例
2019/01/02 Python
Python中变量的输入输出实例代码详解
2019/07/28 Python
Python打印特殊符号及对应编码解析
2020/05/07 Python
Python中常用的os操作汇总
2020/11/05 Python
Python Selenium库的基本使用教程
2021/01/04 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
荷兰男士时尚网上商店:Suitable
2017/12/25 全球购物
全球工业:Global Industrial
2020/02/01 全球购物
全球最受追捧的运动服品牌领先数字目的地:Stylerunner
2020/11/25 全球购物
自荐信格式的六要素
2013/09/21 职场文书
护理学毕业生求职信
2013/11/14 职场文书
入党思想汇报
2014/01/05 职场文书
春节活动策划方案
2014/01/24 职场文书
自动化毕业生专业自荐书范文
2014/02/04 职场文书
护理专业自荐书
2014/06/04 职场文书
领导班子党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
列车乘务员工作不细心检讨书
2014/10/07 职场文书
本科毕业答辩开场白
2015/05/27 职场文书
详解Laravel制作API接口
2021/05/31 PHP