DoboWiki
Top
> .NETプログラミング研究/84 をテンプレートにして作成
.NETプログラミング研究/84 をテンプレートにして作成
開始行:
#title(Microsoft ASP.NET AJAXを使う5)
#navi(.NETプログラミング研究)
#contents
*Microsoft ASP.NET AJAXを使う5 [#a70e9aed]
**WebサービスのメソッドをJavaScriptから呼び出す [#p124f866]
これまではUpdatePanelコントロールを中心にASP.NET AJAXを説...
ここでもう一度原点に返って、自分で作成したWebサービスを利...
ここでは、第78号で紹介した「[[.NETの機能を使用せずに、Aja...
***Webサービス [#s3668658]
まずは、Webサービスの作成です。「[[.NETの機能を使用せずに...
#code(vbnet){{
<%@ WebService Language="VB" Class="WebService" %>
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
<WebService(Namespace := "http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_...
<System.Web.Script.Services.ScriptService> _
Public Class WebService
Inherits System.Web.Services.WebService
<WebMethod()> _
Public Function GetYoupackFee(ByVal packSize As Integ...
'(省略)
End Function
End Class
}}
#code(csharp){{
<%@ WebService Language="C#" Class="WebService" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1...
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
[WebMethod]
public int GetYoupackFee(int packSize)
{
//(省略)
}
}
}}
「[[.NETの機能を使用せずに、Ajaxを使用する方法>../78#nodo...
ただし、Web.configに以下のような設定を追加して、ScriptHan...
#pre{{
<system.web>
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx" type="System.Web.Script.S...
</httpHandlers>
<system.web>
}}
***ページ [#zcd2385f]
次に、Webサービスを呼び出すページを作成します。前回との違...
そして、ScriptManagerの[[Servicesプロパティ>MSDN:ScriptMa...
#code(vbnet){{
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional...
"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>
</head>
<body>
<h1>ゆうパック送料検索</h1>
<p>同一都道府県内への配達、重量30kgまで</p>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="ser...
<Scripts>
<asp:ScriptReference Path="ajax.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.as...
</Services>
</asp:ScriptManager>
<asp:Label
ID="Label1"
runat="server"
Text="荷物の大きさ(縦・横・高さの合計): "
AssociatedControlID="PackageSizeList">
</asp:Label>
<asp:DropDownList
ID="PackageSizeList"
runat="server">
<asp:ListItem Value="0">(選択してください)<...
<asp:ListItem Value="60">60cmまで</asp:ListIt...
<asp:ListItem Value="80">80cmまで</asp:ListIt...
<asp:ListItem Value="100">100cmまで</asp:List...
<asp:ListItem Value="120">120cmまで</asp:List...
<asp:ListItem Value="140">140cmまで</asp:List...
<asp:ListItem Value="160">160cmまで</asp:List...
<asp:ListItem Value="170">170cmまで</asp:List...
</asp:DropDownList>
<br />
<asp:Label ID="ResultLabel" runat="server"></asp:...
</div>
</form>
</body>
</html>
}}
#code(csharp){{
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional...
"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>
</head>
<body>
<h1>ゆうパック送料検索</h1>
<p>同一都道府県内への配達、重量30kgまで</p>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="ser...
<Scripts>
<asp:ScriptReference Path="ajax.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.as...
</Services>
</asp:ScriptManager>
<asp:Label
ID="Label1"
runat="server"
Text="荷物の大きさ(縦・横・高さの合計): "
AssociatedControlID="PackageSizeList">
</asp:Label>
<asp:DropDownList
ID="PackageSizeList"
runat="server">
<asp:ListItem Value="0">(選択してください)<...
<asp:ListItem Value="60">60cmまで</asp:ListIt...
<asp:ListItem Value="80">80cmまで</asp:ListIt...
<asp:ListItem Value="100">100cmまで</asp:List...
<asp:ListItem Value="120">120cmまで</asp:List...
<asp:ListItem Value="140">140cmまで</asp:List...
<asp:ListItem Value="160">160cmまで</asp:List...
<asp:ListItem Value="170">170cmまで</asp:List...
</asp:DropDownList>
<br />
<asp:Label ID="ResultLabel" runat="server"></asp:...
</div>
</form>
</body>
</html>
}}
***ServiceReference.InlineScriptプロパティ [#s2d782c2]
この例では、Servicesプロパティに追加する[[ServiceReferenc...
InlineScriptプロパティがfalseのときは、後述する[[プロキシ...
つまり、InlineScriptプロパティがfalseのときは、サーバーへ...
***JavaScript [#i5a7b6ad]
最後に、Webサービスを呼び出すJavaScriptを作成します。前回...
#code(javascript){{
var msgElement, listElement;
//アプリケーションのloadイベントハンドラを追加
Sys.Application.add_load(ApplicationLoad)
//アプリケーションのloadイベントハンドラ
function ApplicationLoad(sender, args)
{
msgElement = $get('ResultLabel');
listElement = $get('PackageSizeList');
//DropDownListのonchangeイベントハンドラを追加する
$addHandler(listElement, 'change', onChange);
}
//リストのonchangeイベントハンドラ
function onChange()
{
if (listElement.value == "0")
{
msgElement.innerHTML = "";
return;
}
msgElement.innerHTML = "読み込み中...";
//Webサービスにアクセスする
WebService.GetYoupackFee(listElement.value, OnSucceed...
}
//成功したとき
function OnSucceeded(result, userContext, methodName)
{
msgElement.innerHTML = "料金は " + result + "円";
}
//失敗したとき
function OnFailed(error, userContext, methodName)
{
if(error != null)
{
msgElement.innerHTML = "エラー: " + error.get_mes...
}
}
//スクリプトの読み込みが完了したことをScriptManagerに知ら...
if (typeof(Sys) !== 'undefined') Sys.Application.notifySc...
}}
loadイベントハンドラでは、DropDownList"PackageSizeList"の...
***プロキシクラス [#proxyclass]
onchangeイベントハンドラでWebサービスを呼び出しています。...
なぜこれだけ簡単にWebサービスメソッドを呼び出せるかという...
[[プロキシクラスのメソッド>MSDN:生成されたプロキシ クラス...
その次のパラメータには、Webサービスへの要求が成功したとき...
その次のパラメータには、失敗したときに呼び出されるコール...
上の例では省略しましたが、さらに次のパラメータに、ユーザ...
プロキシクラスの[[timeoutプロパティ>MSDN:生成されたプロキ...
補足:成功コールバック関数、失敗コールバック関数、ユーザ...
[[成功コールバック関数>MSDN:生成されたプロキシ クラスの成...
[[失敗コールバック関数>MSDN:生成されたプロキシ クラスの失...
***Sys.Net.WebServiceProxyクラス [#saa0da19]
プロキシクラスは、[[Sys.Net.WebServiceProxyクラス>MSDN:Sy...
上記の例を改造して、ScriptManagerのServicesにWebサービス...
#code(javascript){{
Sys.Net.WebServiceProxy.invoke('WebService.asmx',
'GetYoupackFee',
false,
{'packSize':listElement.value},
OnSucceeded,
OnFailed,
null,
60000);
}}
このように[[WebServiceProxy.invokeメソッド>MSDN:Sys.Net.W...
**参考 [#c453a28c]
-[[MSDN:ASP.NET AJAX での Web サービス]]
**コメント [#d2c25706]
#comment
//これより下は編集しないでください
#pageinfo([[:Category/.NET]] [[:Category/ASP.NET]],2008-0...
終了行:
#title(Microsoft ASP.NET AJAXを使う5)
#navi(.NETプログラミング研究)
#contents
*Microsoft ASP.NET AJAXを使う5 [#a70e9aed]
**WebサービスのメソッドをJavaScriptから呼び出す [#p124f866]
これまではUpdatePanelコントロールを中心にASP.NET AJAXを説...
ここでもう一度原点に返って、自分で作成したWebサービスを利...
ここでは、第78号で紹介した「[[.NETの機能を使用せずに、Aja...
***Webサービス [#s3668658]
まずは、Webサービスの作成です。「[[.NETの機能を使用せずに...
#code(vbnet){{
<%@ WebService Language="VB" Class="WebService" %>
Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
<WebService(Namespace := "http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_...
<System.Web.Script.Services.ScriptService> _
Public Class WebService
Inherits System.Web.Services.WebService
<WebMethod()> _
Public Function GetYoupackFee(ByVal packSize As Integ...
'(省略)
End Function
End Class
}}
#code(csharp){{
<%@ WebService Language="C#" Class="WebService" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1...
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
[WebMethod]
public int GetYoupackFee(int packSize)
{
//(省略)
}
}
}}
「[[.NETの機能を使用せずに、Ajaxを使用する方法>../78#nodo...
ただし、Web.configに以下のような設定を追加して、ScriptHan...
#pre{{
<system.web>
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx" type="System.Web.Script.S...
</httpHandlers>
<system.web>
}}
***ページ [#zcd2385f]
次に、Webサービスを呼び出すページを作成します。前回との違...
そして、ScriptManagerの[[Servicesプロパティ>MSDN:ScriptMa...
#code(vbnet){{
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional...
"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>
</head>
<body>
<h1>ゆうパック送料検索</h1>
<p>同一都道府県内への配達、重量30kgまで</p>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="ser...
<Scripts>
<asp:ScriptReference Path="ajax.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.as...
</Services>
</asp:ScriptManager>
<asp:Label
ID="Label1"
runat="server"
Text="荷物の大きさ(縦・横・高さの合計): "
AssociatedControlID="PackageSizeList">
</asp:Label>
<asp:DropDownList
ID="PackageSizeList"
runat="server">
<asp:ListItem Value="0">(選択してください)<...
<asp:ListItem Value="60">60cmまで</asp:ListIt...
<asp:ListItem Value="80">80cmまで</asp:ListIt...
<asp:ListItem Value="100">100cmまで</asp:List...
<asp:ListItem Value="120">120cmまで</asp:List...
<asp:ListItem Value="140">140cmまで</asp:List...
<asp:ListItem Value="160">160cmまで</asp:List...
<asp:ListItem Value="170">170cmまで</asp:List...
</asp:DropDownList>
<br />
<asp:Label ID="ResultLabel" runat="server"></asp:...
</div>
</form>
</body>
</html>
}}
#code(csharp){{
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional...
"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>
</head>
<body>
<h1>ゆうパック送料検索</h1>
<p>同一都道府県内への配達、重量30kgまで</p>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="ser...
<Scripts>
<asp:ScriptReference Path="ajax.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.as...
</Services>
</asp:ScriptManager>
<asp:Label
ID="Label1"
runat="server"
Text="荷物の大きさ(縦・横・高さの合計): "
AssociatedControlID="PackageSizeList">
</asp:Label>
<asp:DropDownList
ID="PackageSizeList"
runat="server">
<asp:ListItem Value="0">(選択してください)<...
<asp:ListItem Value="60">60cmまで</asp:ListIt...
<asp:ListItem Value="80">80cmまで</asp:ListIt...
<asp:ListItem Value="100">100cmまで</asp:List...
<asp:ListItem Value="120">120cmまで</asp:List...
<asp:ListItem Value="140">140cmまで</asp:List...
<asp:ListItem Value="160">160cmまで</asp:List...
<asp:ListItem Value="170">170cmまで</asp:List...
</asp:DropDownList>
<br />
<asp:Label ID="ResultLabel" runat="server"></asp:...
</div>
</form>
</body>
</html>
}}
***ServiceReference.InlineScriptプロパティ [#s2d782c2]
この例では、Servicesプロパティに追加する[[ServiceReferenc...
InlineScriptプロパティがfalseのときは、後述する[[プロキシ...
つまり、InlineScriptプロパティがfalseのときは、サーバーへ...
***JavaScript [#i5a7b6ad]
最後に、Webサービスを呼び出すJavaScriptを作成します。前回...
#code(javascript){{
var msgElement, listElement;
//アプリケーションのloadイベントハンドラを追加
Sys.Application.add_load(ApplicationLoad)
//アプリケーションのloadイベントハンドラ
function ApplicationLoad(sender, args)
{
msgElement = $get('ResultLabel');
listElement = $get('PackageSizeList');
//DropDownListのonchangeイベントハンドラを追加する
$addHandler(listElement, 'change', onChange);
}
//リストのonchangeイベントハンドラ
function onChange()
{
if (listElement.value == "0")
{
msgElement.innerHTML = "";
return;
}
msgElement.innerHTML = "読み込み中...";
//Webサービスにアクセスする
WebService.GetYoupackFee(listElement.value, OnSucceed...
}
//成功したとき
function OnSucceeded(result, userContext, methodName)
{
msgElement.innerHTML = "料金は " + result + "円";
}
//失敗したとき
function OnFailed(error, userContext, methodName)
{
if(error != null)
{
msgElement.innerHTML = "エラー: " + error.get_mes...
}
}
//スクリプトの読み込みが完了したことをScriptManagerに知ら...
if (typeof(Sys) !== 'undefined') Sys.Application.notifySc...
}}
loadイベントハンドラでは、DropDownList"PackageSizeList"の...
***プロキシクラス [#proxyclass]
onchangeイベントハンドラでWebサービスを呼び出しています。...
なぜこれだけ簡単にWebサービスメソッドを呼び出せるかという...
[[プロキシクラスのメソッド>MSDN:生成されたプロキシ クラス...
その次のパラメータには、Webサービスへの要求が成功したとき...
その次のパラメータには、失敗したときに呼び出されるコール...
上の例では省略しましたが、さらに次のパラメータに、ユーザ...
プロキシクラスの[[timeoutプロパティ>MSDN:生成されたプロキ...
補足:成功コールバック関数、失敗コールバック関数、ユーザ...
[[成功コールバック関数>MSDN:生成されたプロキシ クラスの成...
[[失敗コールバック関数>MSDN:生成されたプロキシ クラスの失...
***Sys.Net.WebServiceProxyクラス [#saa0da19]
プロキシクラスは、[[Sys.Net.WebServiceProxyクラス>MSDN:Sy...
上記の例を改造して、ScriptManagerのServicesにWebサービス...
#code(javascript){{
Sys.Net.WebServiceProxy.invoke('WebService.asmx',
'GetYoupackFee',
false,
{'packSize':listElement.value},
OnSucceeded,
OnFailed,
null,
60000);
}}
このように[[WebServiceProxy.invokeメソッド>MSDN:Sys.Net.W...
**参考 [#c453a28c]
-[[MSDN:ASP.NET AJAX での Web サービス]]
**コメント [#d2c25706]
#comment
//これより下は編集しないでください
#pageinfo([[:Category/.NET]] [[:Category/ASP.NET]],2008-0...
ページ名:
▲
▼
[
トップ
] [
新規
|
子ページ作成
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]