所以我是json / ajax / jquery / webservices
的新手我正在尝试创建一个连接页面,用户可以输入几个字母并立即获得用户名是否可用的即时反馈。
我有一个html文件[用户前端]和一个asmx webservice,webservice检查它是否存在它存在的任何文本[它运行一个工作正常的存储过程]
我的html文件似乎不是调用我的webservice。
我已经通过转到asmx页面并手动输入值验证了web服务的工作情况,并为我返回true或false。
一个问题是它似乎是在XML中返回它,如下所示,而不是json我是它在
<?xml version="1.0" encoding="utf-8"?>
<string xmlns="http://localhost">{"available": false}</string>
那么代码/标记!
我的html文件
<!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 runat="server">
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(document).ready(function () {
var validateUsername = $('#validateUsername');
$('#username').keyup(function () {
var t = this;
if (this.value != this.lastValue) {
if (this.timer) clearTimeout(this.timer);
validateUsername.removeClass('error').html('<img src="images/ajax-loader.gif" height="16" width="16" /> checking availability...');
this.timer = setTimeout(function () {
$.ajax({
contentType: "application/json; charset=utf-8",
url: 'ValidateUser.asmx/GetUsernameAvailable',
data: '{username: "'+t.value + '"}',
dataType: 'json',
type: "post",
success: function (j) {
validateUsername.html('I willl have my logic in here for changing the html on the label to reflect success or failure!');
}
});
}, 200);
this.lastValue = this.value;
}
});
});
//-->
</script>
</head>
<body>
<fieldset>
<div>
<label for="username">Username, valid: a-z.-_</label>
<input type="text" name="username" value="" id="username" />
<span id="validateUsername"></span>
</div>
</fieldset>
</body>
</html>
我的asmx文件
<%@ WebService Language="C#" Class="ValidateUser" %>
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Data;
using System.Data.Odbc;
using System.Web.Script.Serialization;
using System.Web.Script.Services;
using UserSite.DataClasses;
[WebService(Description = "Web services to query Username availability.", Namespace = "http://localhost")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class ValidateUser: System.Web.Services.WebService
{
[WebMethod(Description = "Gets the availability of a username.")]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string GetUsernameAvailable(string username)
{
if (username == null)
{
username = "";
}
DbaseExecSpWithReturnValue Sproc = new DbaseExecSpWithReturnValue();
Sproc.SetSp("sp_CheckUsernameAvailable");
Sproc.AddParam(1);
Sproc.AddParam("Username", SqlDbType.Char, username, 20);
int RetVal = Sproc.Execute();
Sproc.Close();
if (RetVal == 0)
{
return @"{""available"": false}";
}
else
{
return @"{""available"": true}";
}
}
}
因此,当我手动运行asmx文件但是html页面没有调用它并且我的asmx文件没有返回数据时,我看到存储过程正常工作.....所以基本上它让我疯了!
答案 0 :(得分:1)
我认为您的ajax调用数据不正确。根据jquery文档: data选项可以包含形式为key1 = value1&amp; key2 = value2的查询字符串,或者包含{key1:'value1',key2:'value2'}形式的映射。如果使用后一种形式,则在发送之前使用jQuery.param()将数据转换为查询字符串。尝试使用你的ajax而不发送日期来测试你是否可以调用你的WS然后尝试像
这样的东西data :{'username':t.value }
答案 1 :(得分:1)
您使用的是哪个版本的.NET - 如果是3.5,请确保您在web.config中注册了ScriptHandlerFactory和ScriptModule - 这些都负责处理JSON请求。
第二个问题是,在实际的服务实现中,您应该返回所需的对象,ASP.NET基础结构将处理JSON序列化 - 您不必输出实际的JSON数据。例如,
public bool GetUsernameAvailable(string username)
{
...
return (RetVal == 0) ? false : true;
}
上面会返回布尔值,您可以在调用函数中调用它作为j.d
。例如,
...
$ajax({
...
success: function (j) {
alert(j.d); // will alert either true or false
}
...
最后,在浏览器中导航到asmx端点将调用soap端点,并且您将始终获得xml请求 - 响应(这是因为ASP.NET脚本处理程序仅在请求为POST请求且内容类型为时才执行JSON序列化JSON)。正确的调试方法是检查Fiddler等工具中的服务调用。