首先建一个Ajax-WCF服务,[img][/img]图片见附件:,web-config自动配置就没管;
然后,在apsx文件中写js代码:
<script type="text/javascript" language="javascript">
$(function() {
$('#Nick').bind('blur', function() { // BLUR为失去焦点时候触发事件
if ($('#Nick').val() == '') {
alert("用户名不能为空.");
}
else {
$.ajax({
type: 'POST',
url: '<%= MixApplication.Instance.RelativePath %>/Service/RegisterUserService.svc/IsUserExist',
//dataType: 'json', 不要,有的话就会报500,server internal错误
contentType: "application/json",
data: '{"nickName":"' + $('#Nick').val() + '"}',
complete: function(xmlHttpRequest) {
//alert('完整的服务器响应已经收到');
},
success: function(data) {
//var a = eval('(' + data + ')'); //将JSON文本转换为对象
//alert(a.d);
var da = JSON.parse(data).d; // java的反序列化
//alert('data的值是:' + da);
if (da == true) {
$('#nickTip').html('用户名不存在,可以注册');
}
else {
$('#nickTip').css('color', 'red');
$('#nickTip').html('用户名已存在,请另外输入用户名');
}
}
});
}
})
$('#Nick').bind('focus', function() {
$('#nickTip').css('color', '');
$('#nickTip').html('');
})
})
</script>
来判断html控件中名字Nick是否已经存在,相应的html为:
<tr>
<td>
用户昵称:
</td>
<td>
<input name="NickText" id="Nick" type="text" class="long-input" style="width: 120px" />
</td>
<td>
<div id="NickTip" style="width: 270px">
</div>
<p id="nickTip">
</p>
<!--<div id="msg" style="display: none" visible="false">
</div>-->
</td>
</tr>
而相应的WCF服务代码为:
[OperationContract]
[WebInvoke(RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]
public bool IsUserExist(string nickName)
{
bool result = false;
if (UserService.IsUserExsits(nickName)==true) //表示用户不存在
{
result = true;
}
return result;
}
下面错误就出现了:
默认建立WCF服务,并没有 [WebInvoke(RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]这句。后面是在网上看到的,就添加了上去,是为了客户端与服务器端交互的数据都是json;
然后,用jquery调用$.ajax({})服务时候,参照相应参数:datatype:'json',使服务器返回的参数类型是json,但这样的话,同FF调试的时候,HTTP服务器响应的状态值始终是500,intenal server error;
后来网上查了一下,不知道所以,就把datatype:'json'这句注释了,改用contentType: "application/json", 后面就调试成功:在将返回数据反序列话后,就正确提示用户名是否存在的信息。
问题就是:其中contentType: "application/json", 的contentType却不是$.ajax({})中的属性,而且我觉得这句话的contentType: "application/json", 含义就是:与[WebInvoke(RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)] 对应,使得客户端与服务器端交互的数据都是json;但实际上我一开始用datatype:'json'时候传的数据以及服务器返回的数据都是json:
dataType: 'json',
data: '{"nickName":"' + $('#Nick').val() + '"}',
调试成功的用法:
contentType: "application/json",
data: '{"nickName":"' + $('#Nick').val() + '"}',
这两种写法的具体实现由何区别??实现机制难道不一样》?
解析:
$.ajax({})中的data属性:数据在web上传递的时候,由于是对象必须是key/value形式,json格式自动转换格式为:
{"fata1":"aa","data2":"bb"}转换为:&data1=aa&data2=bb,而contentType: "application/json"的具体含义就是始终是json。
- 描述: 图片Image
- 大小: 93.2 KB
分享到:
- 2009-12-05 11:59
- 浏览 2228
- 评论(1)
- 论坛回复 / 浏览 (0 / 2786)
- 查看更多
相关推荐
VS2010中使用Jquery调用Wcf服务源码
用jQuery框架调用WCF的例子代码. 实现增删改查
jquery 调用WCF :多参数 WCF服务接口,创建服务,jquery 通过post方式取得数据
C# Jquery调用WCF 集wcf服务端与客户端于一体。
WCF JS 调用案例 Jquery调用案例 WCF JS 调用案例 Jquery调用案例 WCF JS 调用案例 Jquery调用案例
使用JQuery调用WCF驱动TSC打印机打印二维码的例子
主要介绍了jQuery实现ajax调用WCF服务的方法,以完整实例形式分析了jQuery的ajax前端调用及后台交互调用WCF服务的相关技巧,并附带完整实例共读者下载,需要的朋友可以参考下
jquery调用wcf
jquery 调用 WCF iis 发布wcf
主要介绍了jQuery Ajax调用WCF服务详细教程,本文讲解了从WFC编程到JQUERY调用的详细步骤,并总结了使用中遇到的问题和解决方法,需要的朋友可以参考下
jquery调用不同服务器、不同地址下的wcf服务,解决了jquery的跨域调用问题
本代码演示了使用JQUERY的AJAX方法调用WCF服务的例子,各种方法都做了演示。
借用jQuery强大的库,使用JavaScript访问WCF服务非常简便。同事研究了一个breeze库,那么屌丝就来试验一下ajax。这里把实现简单地记录以便马克一下,以后忘了就看这篇日志来作弊。 一、更改WCF服务的配置 默认情况下...
本人自己写的一个jquery访问wcf的案例,很适合初学者
个人收集jquery 跨域调用 wcf解决方案
网上看了很多jquery调用wcf的例子,可能是主机的原因,我用的是gd主机,所以都没有成功,昨天自己搞了一天,终于成功了,现把方法和代码和大家分享