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实现鼠标经过表格行变色的方法
May 12 Javascript
超赞的动手创建JavaScript框架的详细教程
Jun 30 Javascript
JS+CSS实现带有碰撞缓冲效果的竖向导航条代码
Sep 15 Javascript
深入浅出ES6新特性之函数默认参数和箭头函数
Aug 01 Javascript
js中获取键盘事件的简单实现方法
Oct 10 Javascript
Vue如何实现组件的源码解析
Jun 08 Javascript
parabola.js抛物线与加入购物车效果的示例代码
Oct 25 Javascript
微信小程序实现点击按钮移动view标签的位置功能示例【附demo源码下载】
Dec 06 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
在Angular中使用JWT认证方法示例
Sep 10 Javascript
使用element-ui table expand展开行实现手风琴效果
Mar 15 Javascript
Node.js从字符串生成文件流的实现方法
Aug 18 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访问MYSQL数据库封装类(附函数说明)
2010/12/04 PHP
使用PHP编写发红包程序
2015/07/22 PHP
PHP读取大文件的多种方法介绍
2016/04/04 PHP
php简单实现批量上传图片的方法
2016/05/09 PHP
JQuery 常用操作代码
2010/03/14 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
javascript ready和load事件的区别示例介绍
2013/08/30 Javascript
浅谈 jQuery 事件源码定位问题
2014/06/18 Javascript
JQuery实现展开关闭层的方法
2015/02/17 Javascript
node.js [superAgent] 请求使用示例
2015/03/13 Javascript
jquery实现图片随机排列的方法
2015/05/04 Javascript
jQuery满意度星级评价插件特效代码分享
2015/08/19 Javascript
利用JS判断鼠标移入元素的方向
2016/12/11 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
2017/11/10 Javascript
JS声明对象时属性名加引号与不加引号的问题及解决方法
2018/02/16 Javascript
关于Angularjs中跨域设置白名单问题
2018/04/17 Javascript
在vue中实现点击选择框阻止弹出层消失的方法
2018/09/15 Javascript
小程序实现锚点滑动效果
2019/09/23 Javascript
微信小程序用canvas画图并分享
2020/03/09 Javascript
跟老齐学Python之使用Python查询更新数据库
2014/11/25 Python
在Python中使用Neo4j数据库的教程
2015/04/16 Python
使用实现XlsxWriter创建Excel文件并编辑
2018/05/04 Python
python实现flappy bird小游戏
2018/12/24 Python
pycharm sciview的图片另存为操作
2020/06/01 Python
升级keras解决load_weights()中的未定义skip_mismatch关键字问题
2020/06/12 Python
python 调用Google翻译接口的方法
2020/12/09 Python
挪威手表购物网站:Klokker
2016/09/19 全球购物
美国玛丽莎收藏奢华时尚商店:Marissa Collections
2016/11/21 全球购物
介绍一下Prototype的$()函数,$F()函数,$A()函数都是什么作用?
2014/03/05 面试题
学生思想表现的评语
2014/01/30 职场文书
《狐假虎威》教学反思
2014/02/07 职场文书
学生请假条格式
2014/04/11 职场文书
学雷锋月活动总结
2014/04/25 职场文书
大学学习计划书范文
2014/05/02 职场文书
员工辞退通知书
2015/04/17 职场文书
2016参观监狱警示教育活动心得体会
2016/01/15 职场文书