SQL Server データベースに次のようなテーブルがあるとします。
StateName notes
alabama 'notes about alabama'
alaska 'notes about alaska'
..... .........
編集: この質問は 2 つの部分に分けられます。1 つは最初の問題で、なぜうまくいかなかったのか、そして私の改良された、できればより正確な 2 番目の解決策です。
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 エラーを読み込めませんでした」ということであることがわかりました。メソッド名とパラメーターが見つからないことを教えてくれました（すべての権利でそこにあったとしても）。そこで、2 番目の方法を試してみました。これはより良い方法のようです (機能させることができれば!)
そこで、「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ます。（データ）を「テスト」に変更すると、「テスト」の正しい出力が画面に表示されます。つまり、問題のある部分はsuccessAjax 呼び出しの部分です。GetData 関数にブレークポイントを設定しstateNotes、適切なテキスト値を受け取っているので、問題が残る場所はsuccessajax 呼び出しの行だけです。