ModalPopupExtenderに配置したGridViewの選択行取得

ModalPopupExtenderに配置したGridViewの選択行を取得したいと思っています。
下記コードはIE11では取得できたのですがFireFox バージョン60.0.1では動きませんでした。

ASPX
1Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);

がデバッグで入ってきません。
FireFoxの最新版では対応していないのでしょうか？
また、他の方法でGridViewの選択行を取得できるようでしたら教えて頂けないでしょうか。

コードは以下のようになります。

aspx
1<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Test.Test" MaintainScrollPositionOnPostback="true"%>
2
3<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
4
5<!DOCTYPE html>
6
7<html xmlns="http://www.w3.org/1999/xhtml">
8<head id="Head1" runat="server">
9    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
10    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
11    <title>テスト</title>
12
13    <script type="text/javascript" src="scripts/Common.js"></script>
14    </head>
15<body>
16    <form id="form1" runat="server" defaultbutton="DummySubmitButton">
17    <asp:ScriptManager ID="myScriptManager" runat="server"></asp:ScriptManager>
18    <asp:Button ID="DummySubmitButton" runat="server" Text="Button" OnClientClick="return false;" style="display:none" />  
19    <div>
20        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
21        <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="PUSH" />
22        <asp:Panel ID="Panel1" runat="server">
23        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
24            <ContentTemplate>
25                <asp:Button ID="DummyButton" runat="server" Text="" Style="display:none" />
26                <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
27                    TargetControlID="DummyButton" 
28                    PopupControlID="Panel1"
29                    DropShadow="true"
30                    BackgroundCssClass="modal">
31                </ajaxToolkit:ModalPopupExtender>
32                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
33OnSelectedIndexChanged="GridView1_SelectedIndexChanged" 
34                    OnRowDataBound="GridView1_RowDataBound" AutoGenerateSelectButton="True" EnableTheming="True">
35                    <Columns>
36                        <asp:BoundField DataField="Test" HeaderText="テスト" />
37                    </Columns>
38                </asp:GridView>
39            </ContentTemplate>
40        </asp:UpdatePanel>  
41        </asp:Panel>
42    </div>
43    </form>
44</body>
45</html>

C#
1using System;
2using System.Collections.Generic;
3using System.Linq;
4using System.Web;
5using System.Web.UI;
6using System.Web.UI.WebControls;
7using System.Data;
8using System.Data.OleDb;
9using System.Diagnostics;
10using Microsoft.VisualBasic.FileIO;
11using System.Text.RegularExpressions;
12
13namespace Test
14{
15    public partial class Test: System.Web.UI.Page
16    {
17        protected void Page_Load(object sender, EventArgs e)
18        {
19            if (!IsPostBack)
20            {
21                DataTable dt = new DataTable();
22                dt.Columns.Add("Test");
23                dt.Rows.Add(new object[] { "1" });
24                dt.Rows.Add(new object[] { "2" });
25                dt.Rows.Add(new object[] { "3" });
26                dt.Rows.Add(new object[] { "4" });
27                GridView1.DataSource = dt;
28                GridView1.DataBind();
29            }
30        }
31
32        protected void Button1_Click(object sender, EventArgs e)
33        {
34            UpdatePanel1.Update();
35            ModalPopupExtender1.Show();
36            if (GridView1.Rows.Count > 0)
37            {
38                GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
39            }
40        }
41
42        protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
43        {
44            if (ScriptManager.GetCurrent(this).IsInAsyncPostBack)
45            {
46                ScriptManager.GetCurrent(this).RegisterDataItem(GridView1, GridView1.SelectedRow.Cells[1].Text);
47            }
48            ModalPopupExtender1.Hide();
49        }
50
51        protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
52        {
53            if (e.Row.RowType == DataControlRowType.Header)
54            {
55                // Hiding the Select Button Cell in Header Row.
56                e.Row.Cells[0].Style.Add(HtmlTextWriterStyle.Display, "none");
57            }
58
59            if (e.Row.RowType == DataControlRowType.DataRow)
60            {
61                // Hiding the Select Button Cells showing for each Data Row. 
62                e.Row.Cells[0].Style.Add(HtmlTextWriterStyle.Display, "none");
63
64                // Attaching one onclick event for the entire row, so that it will
65                // fire SelectedIndexChanged, while we click anywhere on the row.
66                if (e.Row.Cells[1].Text != "&nbsp;")
67                {
68                    e.Row.Attributes.Add("onclick", ClientScript.GetPostBackClientHyperlink(GridView1, "Select$" + e.Row.RowIndex));
69                }
70            }
71        }
72    }
73}

JavaScript
1function pageLoad(sender, args) {
2    // 非同期通信
3    Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);
4}
5
6function pageLoaded(sender, args) {
7    var test = args.get_dataItems()["GridView1"];
8    if (test ) {
9        document.getElementById("TextBox1").innerText = test ;
10    }
11}

すみません。開発環境等追記します。
サーバーOS：Windows Server 2012
クライアントOS：Windows7
.NET：4.0
サーバーIIS：~~6.2~~8.0
クライアントIIS：10.0 Express
Visual Studio：2015 Community
~~不勉強で申し訳ございません。テンプレートは意味すら分かりません。~~テンプレート：空
Ajax Control Toolkit：（おそらく）18.1 こちらからダウンロード

2018/05/31追記
実現したいこととしてはAccessのシステムをASP.NETに移植するに当たり、複数列のコンボボックスを作成したいということです。
1.ボタンを押す
2.複数列コンボボックスに見立てたGridViewを表示（提示したコードは1列ですが実際は複数列）
3.GridViewから選択した行のセルの値をTextBoxに表示
（ModalPopupExtenderを使用したのはJavascriptのShowModalDialogはChromeで動かないとの記事がありましたので）
要はAccessのような複数列コンボボックスが作成したいと思っています。

退会済みユーザー

2018/05/30 05:58

開発環境（OS, .NET, IIS, Visual Studio のバージョン。テンプレートは何で作ったか・・・など）を書いてください。

退会済みユーザー

2018/05/30 06:03

ところで、質問者さんの前のスレッドの問題（Visual Studio の不具合）はどうなったのでしょう？　Visual Studio に不具合があって、この問題と関係あるとすると（あるのかないのかは誰にも分かりませんが）、Q&A は意味のないものになってしまいます。

tryCSharp

2018/05/30 06:09

Visual Studioの不具合は未解決です。。。

退会済みユーザー

2018/05/30 06:17

.NET のバージョンはホントに 4.0 なのですか?　4.0 はサポートされてないです。 https://support.microsoft.com/ja-jp/help/17455/lifecycle-faq-net-framework 4.5.2 以降ではないのですか？

退会済みユーザー

2018/05/30 06:18

IIS のバージョンは 6.2 ではないと思いますが？　また、開発マシンでは IIS Express を使っているのではないですか？

退会済みユーザー

2018/05/30 06:22

テンプレートについては、.NET 4.5.2 以降で、ASP.NET Web Forms アプリであれば、［空］と［Web フォーム］のどちらかのはず。覚えてませんか？

退会済みユーザー

2018/05/30 06:23

Visual Studio の不具合が未解決ということですと、今回の問題へのその不具合の影響は排除しきれないのではないですか？

退会済みユーザー

2018/05/30 08:23

Ajax Control Toolkit のバージョンも書いてください。NuGet からインストールしたのでしょうか？

tryCSharp

2018/05/30 11:59 編集

ターゲットの.NETのバージョンは4.0です。ちなみに社内サイトです。

退会済みユーザー

2018/05/30 16:04

Firefox 60.0.1 で add_pageLoaded(pageLoaded) で設定した pageLoaded に制御が飛ばないと言っているなら、少なくともそれはないです。念のため、Visual Studio Community 2015 で［空］の .NET 4.0 Web Forms アプリで確認しましたが。そこは何かの勘違いでしょう。きちんと問題を切り分けしてください。話はそれからだという感じです。

退会済みユーザー

2018/05/31 00:12 編集

全体的なやりたいことのシナリオ・ストーリーを書いてもらえませんか？それに合わせて徐々に実装しながら検証してみますので。逆に、質問者さんの方では、今のコードを、問題が再現できる必要最低限のところまでどんどん削っていって、問題の切り分け&特定をしてください。

tryCSharp

2018/05/31 01:16 編集

GridView1_SelectedIndexChanged、GridView1_RowDataBoundを削除。Button1_Clickの中身を空にしてもFireFoxではSys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);が実行されません。pageLoadのSys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);の前にalertを書いてalertが出るのでpageLoadに来ていることは確かなのですが。

退会済みユーザー

2018/05/31 01:30

質問者さんの言ってることが理解できません。「Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoaded);が実行されません」かどうかは、pageLoaded イベントが発生した時に pageLoaded メソッドが実行されるかどうかで判断することになるはずですが、それについては前のコメントで「Firefox 60.0.1 で add_pageLoaded(pageLoaded) で設定した pageLoaded に制御が飛ばないと言っているなら、少なくともそれはないです」と言いました。

退会済みユーザー

2018/05/31 01:36

2018/05/31追記を読むと、前のスレッド https://teratail.com/questions/126061 の話の続きのようですね。そのスレッドでは「Postback時の画面の描画が非常に遅い」という問題に対して「ポストバックしてサーバー側で処理して再描画するのはやめて、全てクライアント側で JavaScript / jQuery で処理する」と提案しました。このスレッドの問題は解決できても、前のスレッドの遅いという問題は解決できないように思いますが、いかがですか？　そうだとすると不毛な Q&A になるのではないかと思われますが。

tryCSharp

2018/05/31 01:39

そうですか。。。自分の環境ではpageLoadedに制御が飛ばないのでこのやり方では出来ないということですね。別のモーダル表示を探してみます。何かアイディアがありましたらヒントだけでも頂けると幸いです。

退会済みユーザー

2018/05/31 01:52

「自分の環境ではpageLoadedに制御が飛ばない」というのはどうやって確認したのですか？　コードを必要最低限に削って確認しましたか？　自分が試した例を回答欄に書いておきますので、ここまで削ってみてください。それで Forefox 60.0.1 がダメということですと、多分質問者さん固有の環境の問題だと思います。

tryCSharp

2018/05/31 02:38

「Postback時の画面の描画が非常に遅い」という問題に対応するため今回のコードを書いています。このコードだと問題ない速度で表示されます。

行動規範の内容に同意します

回答1件

ベストアンサー

2018/05/31 10:52 の私のコメントで「自分が試した例を回答欄に書いておきます」と書きましたが、それを以下に書きます。

.aspx.cs（自動生成されたデフォルトのまま）

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebFormsAppNET4
{
    public partial class _default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
    }
}

.aspx

<%@ Page Language="C#" AutoEventWireup="true" 
    CodeBehind="default.aspx.cs" Inherits="WebFormsAppNET4._default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript">
        //<![CDATA[
        var manager;

        function pageLoad(sender, args) {
            if (args.get_isPartialLoad() === false) {
                manager = Sys.WebForms.PageRequestManager.getInstance();
                manager.add_pageLoaded(pageLoaded);
            }
        }

        function pageLoaded(sender, args) {
            if (manager.get_isInAsyncPostBack()) {
                alert('Page Loaded!!!!');
            }
        }

  //]]>
  </script>

</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Button ID="Button1" runat="server" Text="Button" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

【追記】

質問への 2018/05/31 09:12 の私のコメントで「全体的なやりたいことのシナリオ・ストーリーを書いてもらえませんか？それに合わせて徐々に実装しながら検証してみますので」と書きましたが、それを以下に書いておきます。

やりたいことは以下の通りと理解。

(1) Panel 内に UpdatePanel、その中に GridView を実装。

(2) Panel の外に TextBox と Button を配置。

(3) ModalPopupExtender を配置し、PopupControlID を上記 (1) の Panel に、TargetControlID を上記（2）の Button に設定。

(4) Button クリックで Panel（その中の GridView も）表示。

(5) GridView の行選択で Panel を非表示にして TextBox に選択した行のデータを表示。

上記やりたいことの最低限の実装ですが、以下のコードで期待通り Firefox 60.0.1 でも動きます。

質問者さんの環境で動かないとすると、質問者さんの環境固有の問題だと思われます。

動くとすると、これに加えて質問者さんがいろいろ実装したコードの影響だと思います。何か違うのか、何の影響なのか質問者さんの方で良く調べてください。

.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

namespace WebFormsAppNET4
{
    public partial class _default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.Add("Test");
                dt.Rows.Add(new object[] { "1" });
                dt.Rows.Add(new object[] { "2" });
                dt.Rows.Add(new object[] { "3" });
                dt.Rows.Add(new object[] { "4" });
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }
        }

        protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (ScriptManager.GetCurrent(this).IsInAsyncPostBack)
            {
                ScriptManager.GetCurrent(this).RegisterDataItem(GridView1,
                    GridView1.SelectedRow.Cells[1].Text);
            }
            ModalPopupExtender1.Hide();
        }
    }
}

.aspx

<%@ Page Language="C#" AutoEventWireup="true" 
    CodeBehind="default.aspx.cs" Inherits="WebFormsAppNET4._default" %>

<%@ Register Assembly="AjaxControlToolkit" 
    Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript">
        //<![CDATA[
        var manager;

        function pageLoad(sender, args) {
            if (args.get_isPartialLoad() === false) {
                manager = Sys.WebForms.PageRequestManager.getInstance();
                manager.add_pageLoaded(pageLoaded);
            }
        }

        function pageLoaded(sender, args) {
            if (manager.get_isInAsyncPostBack()) {
                var selectedIndex = args.get_dataItems()["GridView1"];
                document.getElementById("TextBox1").value = selectedIndex;
            }
        }

    //]]>
    </script>
    <style type="text/css">
        /*Modal Popup*/
        .modalBackground {
            background-color: Gray;
            filter: alpha(opacity=70);
            opacity: 0.7;
        }

        .popuppanel {
            background-color: #ffffff;
        }
  </style>

</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:Button ID="Button1" runat="server" Text="Button" />
        
        <asp:Panel ID="Panel1" runat="server" CssClass="popuppanel">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>                
                    <asp:GridView ID="GridView1" runat="server" 
                        AutoGenerateColumns="False" 
                        AutoGenerateSelectButton="True" 
                        OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
                        <Columns>
                            <asp:BoundField DataField="Test" HeaderText="テスト" />
                        </Columns>
                    </asp:GridView>
                </ContentTemplate>
            </asp:UpdatePanel>
        </asp:Panel>
        <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" 
            runat="server"
            PopupControlID="Panel1" 
            TargetControlID="Button1" 
            BackgroundCssClass="modalBackground">
        </ajaxToolkit:ModalPopupExtender>
    </form>
</body>
</html>

投稿2018/05/31 01:57

編集2018/05/31 03:45

退会済みユーザー

総合スコア0

tryCSharp

2018/05/31 02:43 編集

ご回答ありがとうございます。 SurferOnWww様のコードでalertが出ることが確認できました。でも自分の当初の目的（自分のテストコードでFireFoxにてpageLoadedを発生させる）が果たせていないのでもう少し調査してみます。

退会済みユーザー

2018/05/31 03:29

2018/05/31 09:12 の質問への私のコメントで「全体的なやりたいことのシナリオ・ストーリーを書いてもらえませんか？それに合わせて徐々に実装しながら検証してみますので」と書きましたが、それを回答欄に書いておきます。やりたいことの最低限の実装ですが、それで期待通り Firefox 60.0.1 でも動きます。質問者さんの環境で動かないとすると、質問者さんの環境固有の問題だと思われます。

tryCSharp

2018/05/31 05:48

ありがとうございます！！！！ SurferOnWww様のコードが上手くいったのでいざ自分の本番コードも修正掛けたのですがFireFox、Chrome共TextBoxに値が設定されず頭を抱えていたのですが、JavaScriptでTextBoxに値を代入する際、innerTextを使っていたのが悪かったようです。大変お手数をお掛け致しました。本当にありがとうございます。

退会済みユーザー

2018/05/31 11:06

デバッガは使えないのですか？ Visual Studio なら JavaScript のコードにもブレークポイントを設定してそこで実行を止められます。pageLoaded メソッドの中にブレークポイントを設定してデバッグ実行して見ればすぐに pageLoaded メソッドに制御が飛んでくるのは分かったのではないですか？

tryCSharp

2018/06/01 03:57 編集

JavaScriptのコードにブレークポイントを置くと「ブレークポイントは現在の設定ではヒットしません。このドキュメントのシンボルは読み込まれていません」と出てしまって…。どうやらVSのバグのようなのですが。毎回毎回本当にお手数をおかけして申し訳ございません。

退会済みユーザー

2018/06/01 04:50

Firefox の問題というのを失念してました。すみません。ブラウザが Firefox の場合は Visual Studio では JavaScript のコードにはブレークポイントが設定できないです。Firefox の開発ツールのデバッガを使ってください。もしくは alert を入れるとか。そうしていれば Firefox でも pageLoaded メソッドに制御は飛ぶということは分かったはずです。それが分かっていれば、メソッドの中だけ注目してすぐ解決できたかもしれませんよ。

tryCSharp

2018/06/01 09:44 編集

FirefoxではJavaScriptのデバッガが効かないのですね。キーワードで検索してもその情報にはたどり着けていませんでした。度々ありがとうございます。たしかにpageLoadedにaleat掛ければこんなに時間を費やすことはなかった…。長くお付き合い頂きましてありがとうございました。

行動規範の内容に同意します