- カタナ
- 大ベテラン
- 会議室デビュー日: 2006/05/25
- 投稿数: 110
|
投稿日時: 2008-06-12 14:41
いつもお世話になります。
現在、ASP.NET2.0(VB) + AjaxControlToolkitで開発を行っています。
UpdatePanel配下のコンボボックスを変更した際にJavaScriptで処理を行いたいのですが、
うまいこといきません。
サンプル的に次のようなプログラムを作りました。よろしくご教授下さい。
- 2つコンボボックスがあります。
- 2つ目のコンボボックスは、UpdatePanel配下にあります。
- UpdatePanelは1つ目のコンボボックスのSelectedIndexChangedがトリガーとなっています。
- 2つ目のコンボボックスを変更した場合に、メッセージを表示したいのですが、表示されません。
- UpdatePanelを使用するとchangeイベントを取得することができないのでしょうか？
| コード: |
|
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="test.aspx.vb" Inherits="test" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>
<asp:DropDownList id="DropDownList1" runat="server" AutoPostBack="True">
<asp:ListItem>あ</asp:ListItem>
<asp:ListItem Value="2">い</asp:ListItem>
<asp:ListItem Value="3">う</asp:ListItem>
</asp:DropDownList>
<asp:UpdatePanel id="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:DropDownList id="DropDownList3" runat="server">
<asp:ListItem>あ</asp:ListItem>
<asp:ListItem Value="2">い</asp:ListItem>
<asp:ListItem Value="3">う</asp:ListItem>
</asp:DropDownList>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownList1" EventName="SelectedIndexChanged"></asp:AsyncPostBackTrigger>
</Triggers>
</asp:UpdatePanel>
</div>
</form>
<script type="text/javascript">
Sys.UI.DomEvent.addHandler($get("DropDownList3"),"change",MessageOut);
function MessageOut()
{
window.alert('MessageOut');
}
</script>
</body>
</html>
[
|
|
|---|
- べる
- ぬし
- 会議室デビュー日: 2003/09/20
- 投稿数: 1093
|
投稿日時: 2008-06-12 22:35
ページ表示直後(DropDownList1の選択を変える前)だと2つ目のコンボボックスを変更したときに
ちゃんとメッセージ出ますよね。
DropDownList1の選択を変えると非同期通信によってDropDownList3は別物になるんでしょうきっと。
なのでもう一度addHandlerしなければなりません。
|
|---|
- カタナ
- 大ベテラン
- 会議室デビュー日: 2006/05/25
- 投稿数: 110
|
投稿日時: 2008-06-13 10:04
べるさん返信ありがとうございます。
確かにベルさんの言われるとおり、ページ表示直後(DropDownList1の選択を変える前)にはメッセージが表示されます。
そこで、ご指摘されたようにaddHandlerを記述してみたのですが、やはり2つ目のコンボボックスを変えた時にメッセージが表示されません。おそらくプログラムが間違えているのだと思いますが、どのように直せばいいのか分かりません。
※特にイベントに何を記述すればいいのかが分かりません。(仮にDummyProcとしています。)
よろしくご教授下さい。
| コード: |
|
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Me.IsPostBack Then
AddHandler DropDownList3.SelectedIndexChanged, New EventHandler(AddressOf DummyProc)
End If
End Sub
Private Sub DummyProc(ByVal sender As Object, ByVal e As System.EventArgs)
End Sub
|
|
|---|
- rain
- ぬし
- 会議室デビュー日: 2006/10/19
- 投稿数: 549
|
投稿日時: 2008-06-13 12:01
DropDownList1の選択を変えたときに発生するのは Page の Load イベントではなく、UpdatePanel2 の Load イベントです。
# AJAX には詳しくないけど、もしかして UpdatePanel を置くと、初回表示時にも Page.Load イベントって発生しないのかな？
で、DropDownList3 の選択を変えたときに JavaScript の関数を呼び出すには、
HTMLでいうと↓のような感じになっていればよくて、
| コード: |
|
<select name="DropDownList3" id="DropDownList3" onChange="MessageOut();">
|
これを実現するためにはLoadイベント内で↓のようにすればよいと思います。
| コード: |
|
DropDownList3.Attributes.Add("onChange", "MessageOut();")
|
|
|---|
- カタナ
- 大ベテラン
- 会議室デビュー日: 2006/05/25
- 投稿数: 110
|
投稿日時: 2008-06-13 13:16
rainさんありがとうございます。
１つめのコンボボックスを変更しても2つ目のコンボボックスを変更した時にメッセージが表示できるようになりました。
本当に助かりました。
|
|---|
