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 相关文章推荐
jquery ajax应用中iframe自适应高度问题解决方法
Apr 12 Javascript
JavaScript中神奇的call()方法
Mar 12 Javascript
Javascript中的Callback方法浅析
Mar 15 Javascript
jQuery下拉美化搜索表单效果代码分享
Aug 25 Javascript
jQuery实现div随意拖动的实例代码(通用代码)
Jan 28 Javascript
jQuery UI库中dialog对话框功能使用全解析
Apr 23 Javascript
支持移动端原生js轮播图
Feb 16 Javascript
BootStrap与Select2使用小结
Feb 17 Javascript
为输入框加入数字js校验代码分享
Nov 02 Javascript
React之PureComponent的使用作用
Jul 10 Javascript
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
Aug 27 Javascript
微信小程序云函数添加数据到数据库的方法
Mar 04 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微框架Dispatch简介
2014/06/12 PHP
PHP Yii框架之表单验证规则大全
2015/11/16 PHP
PHP封装的PDO数据库操作类实例
2017/06/21 PHP
php爬取天猫和淘宝商品数据
2018/02/23 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
extjs 列表框(multiselect)的动态添加列表项的方法
2009/07/31 Javascript
javascrip客户端验证文件大小及文件类型并重置上传
2011/01/12 Javascript
javascript 使用 NodeList需要注意的问题
2013/03/04 Javascript
JS实现一个列表中包含上移下移删除等功能
2014/09/24 Javascript
jquery uploadify 在FF下无效的解决办法
2014/09/26 Javascript
Bootstrap树形组件jqTree的简单封装
2016/01/25 Javascript
js 判断各种数据类型的简单方法(推荐)
2016/08/29 Javascript
用nodejs搭建websocket服务器
2017/01/23 NodeJs
解决jquery appaend元素中id绑定事件失效的问题
2017/09/12 jQuery
jQuery实现IE输入框完成placeholder标签功能的方法
2017/09/20 jQuery
JavaScript实现打印星型金字塔功能实例分析
2017/09/27 Javascript
基于express中路由规则及获取请求参数的方法
2018/03/12 Javascript
vue-router+nginx 非根路径配置方法
2018/06/30 Javascript
解决微信小程序防止无法回到主页的问题
2018/09/28 Javascript
JS实现的对象去重功能示例
2019/06/04 Javascript
JS实现json数组排序操作实例分析
2019/10/28 Javascript
vue-cli —— 如何局部修改Element样式
2020/10/22 Javascript
[03:36]2014DOTA2 TI小组赛综述 八强诞生进军钥匙球馆
2014/07/15 DOTA
Python实现脚本锁功能(同时只能执行一个脚本)
2017/05/10 Python
Python列表生成式与生成器操作示例
2018/08/01 Python
详解从Django Rest Framework响应中删除空字段
2019/01/11 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
大二学生职业生涯规划书
2014/02/05 职场文书
《美丽的南沙群岛》教学反思
2014/04/27 职场文书
2015最新婚礼主持词
2015/06/30 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
2016年“我们的节日·重阳节”主题活动总结
2016/04/01 职场文书
微信小程序APP的生命周期及页面的生命周期
2022/04/19 Javascript
MySQL数据库之内置函数和自定义函数 function
2022/06/16 MySQL
mysql sock 文件解析及作用讲解
2022/07/15 MySQL