假设我在 SQL Server 数据库中有一个表,看起来像
StateName notes
alabama 'notes about alabama'
alaska 'notes about alaska'
..... .........
编辑:这个问题将分为两部分,一个是针对最初的问题以及为什么它不起作用以及我的改革,希望更准确的第二个解决方案。
在 Web 表单中,状态的名称表示为表格内的链接按钮。我正在尝试使用 jQuery 进行 Ajax 数据库调用,当用户单击状态名称时,链接按钮的文本值将被发送到数据库中的存储过程。该存储过程类似于
create proc spGetStateData
@stateName varchar(50)
as
begin
select notes from
states
where statename = @stateName
end
出于测试目的,我添加了一个文本框和一个按钮,以便当用户在文本框中键入状态名称时,会显示数据库表 中的Notes
列。States
[WebMethod]
public static string GetStateData(string stateName)
{
string stateNotes = string.Empty;
string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
using (SqlConnection con = new SqlConnection(cs))
{
using (SqlCommand cmd = new SqlCommand("spGetStateData", con))
{
con.Open();
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@stateName", stateName);
stateNotes = cmd.ExecuteScalar().ToString();
}
}
return stateNotes;
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblStateNotes.Text = GetStateData(txtStateName.Text);
hiddenDiv.Visible = true;
}
这部分有效,所以我知道失败的不是我的 WebMethod 或数据库连接。当我尝试用 jQuery 做同样的事情时,它失败了。
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("#states a").click(function () {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "WebForm1.aspx/GetStateData",
data: $(this).text(),
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (x) {
alert('error');
}
});
});
});
</script>
好的,我打开了 Chrome 的开发人员工具,发现 AJAX 失败的原因是我收到“无法加载资源 HTTP 500 错误”。它告诉我找不到方法名称和参数(即使它们在那里)。所以我尝试了第二种方法,这似乎是一种更好的方法(如果我能让它工作的话!)
所以我想'让我们使用WebService'。这是我的演绎:
<!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">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("a").click(function () {
var stateName = JSON.stringify({ "stateName": $(this).text() });
$.ajax({
type: "POST",
url: "GetStateData.asmx/GetData",
contentType: "application/json; charset=utf-8",
data: stateName,
dataType: "json",
success: function (data) {
$("#lblNotes").text(data);
},
error: function (x) {
alert('message');
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<a href="#">Alabama</a>
<a href="#">Alaska</a>
<asp:Label runat="server" ID="lblNotes"></asp:Label>
</div>
</form>
</body>
</html>
网络服务:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.Script.Services;
namespace jQueryAjaxWebservice
{
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[System.Web.Script.Services.ScriptService]
public class GetStateData : System.Web.Services.WebService
{
[WebMethod]
[ScriptMethod]
public string GetData(string stateName)
{
string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
string stateNotes ="test" ;
using (SqlConnection con = new SqlConnection(cs))
{
using (SqlCommand cmd = new SqlCommand("spGetStateData",con))
{
con.Open();
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@stateName", stateName);
stateNotes = cmd.ExecuteScalar().ToString();
}
}
return stateNotes;
}
}
}
我已经测试了 WebService,它可以工作。但是,当我尝试从 default.aspx 调用 Web 服务代码时,我得到[Object object]
的是lblNotes
文本。如果我将(数据)更改为“测试”,那么我会在屏幕上得到正确的“测试”输出。所以错误的部分是在success
Ajax 调用的部分。我在 GetData 函数上放置了一个断点,并且stateNotes
正在接收正确的文本值,因此唯一存在问题的地方是在success
ajax 调用的行中。