C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[6]: GridView内のラジオボタン変更イベント取得方法


(過去ログ 139 を表示中)

[トピック内 7 記事 (1 - 7 表示)]  << 0 >>

■81704 / inTopicNo.1)  GridView内のラジオボタン変更イベント取得方法
  
□投稿者/ hi (1回)-(2016/10/28(Fri) 23:23:22)

分類:[VB.NET/VB2005 以降] 

いつもお世話になっております。
開発環境は、ASP.net、VB.net(Visual Studio2013)、.net Framework 4です。
GridView 内のラジオボタンで、1行だけレコード選択できるようにしました。
1行だけ選択するために、下記サイトの通り、JavaScript を使いました。
http://surferonwww.info/BlogEngine/post/2013/08/30/radiobutton-in-girdview.aspx

そこで、質問させて下さい。
ラジオボタンを変更(押下)したタイミングで、GridViewの選択列にある値をラベルに表示したいのですが、どう実装すれば良いでしょうか??
ラジオボタンでGridView の1行を選択後、「ボタンを押したら」GridViewの選択列にある値をラベルに表示する、というのは実装できました。

しかし、ラジオボタンを変更しても、GridView.SelectedIndexChanged イベントは起きませんでした。

itemtempleteのラジオボタンに
OnCheckedChanged="RadioButton1_CheckedChanged" などとし、サーバ側で
Protected Sub RadioButton1_CheckedChanged(ByVal sender As Object, ByVal e As System.EventArgs…
のように書けばイベントを拾えますか?

あるいは、ラジオボタンのAutoPostBack=trueにすればイベントを拾えるのでしょうか?

色々調べても解決方法が見つからず、困っております。
どなたかご教授頂けますと助かります!
引用返信 編集キー/
■81705 / inTopicNo.2)  Re[1]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ WebSurfer (1058回)-(2016/10/29(Sat) 00:41:27)
No81704 (hi さん) に返信

ラジオボタンクリックで即ポストバックするなら普通のボタンでいいはずです。
それなら GridView に備わっている機能で簡単に実現できるのでそちらの方を
検討されてはいかがですか?
引用返信 編集キー/
■81706 / inTopicNo.3)  Re[2]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ hi (2回)-(2016/10/29(Sat) 08:51:52)
WebSurfer様、ご返答ありがとうございます!!
勝手ながら、ブログを参考にさせて頂きました。
勉強になる内容ばかりで、いつも楽しみに見せて頂いています!
(残念ながら、開発をはじめて間もない新参者なので、コメントは入れられていないのですが)

おっしゃる通り、最初はGridView のAutoGenerateSelectButtonを有効にしたり、普通にボタンを置いて行選択するようにしたのですが、
ラジオボタンが良いとのユーザーの強い要望があり、実装を試みています。

できれば、ラジオボタンをクリックした際に実行される、ラジオボタン押し直しのJavaScript 内で、
WebSurfer様の例でいうと、「PriductIDを取得しLabel1.textにセットする」という処理を行いたいです。
が、その方法が分からず困っております…

JavaScript 内でできなければ、サーバ側で処理する方法も…と、今回の質問を上げたのですが、
そのせいで分かり辛くなってしまいました、申し訳ありません。
開発環境の規約等で、カスタムコントロールの作成は、なるべく避けたいのですが…

何かアドバイスを頂けますと、非常に助かります!
引用返信 編集キー/
■81708 / inTopicNo.4)  Re[3]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ WebSurfer (1059回)-(2016/10/29(Sat) 12:40:55)
No81706 (hi さん) に返信

> できれば、ラジオボタンをクリックした際に実行される、ラジオボタン押し直しのJavaScript 内で、
> WebSurfer様の例でいうと、「PriductIDを取得しLabel1.textにセットする」という処理を行いたいです。

クライアント側で JavaScript / jQuery を使って行うということであれば、以下のようにしてみては
いかがですか?

(以下の説明は参考にされているブログの記事のコードがベースです)

クライアント側で行うと言うことは ASP.NET がレンダリングした html ソースを考えて、それから
ProductID を JavaScript / jQuery を使って取得し、Label1 に表示すると言うことになります。

ASP.NET が RadioButton コントロールを html コードに変換すると input type="radio" になりま
すが、何もしなければその input 要素には ProductID 情報は含まれません。

なので、input 要素に属性を追加して、それに ProductID 情報を設定してやります。例えば、追加
する属性の名前を data とすると、GridView の RowDataBound イベントで以下のようにして設定で
きます。

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        Control control = e.Row.FindControl("RadioButton1");
        if (control != null)
        {
            // Attributes プロパティではダメ。
            // input 要素に data 属性が直接設定されず <span> ... </span> で
            // input 要素が囲われ span 要素に data 属性が追加さてしまうので
            // InputAttributes プロパティを使うこと。
            ((RadioButton)control).InputAttributes["data"] =
                ((System.Data.DataRowView)e.Row.DataItem)["ProductID"].ToString();
        }
    }
}

そうすると、ASP.NET がレンダリングする html ソースは以下のようになるはずです。

<input id="GridView1_RadioButton1_0" 
    type="radio" 
    name="GridView1$ctl02$RadioButton1" 
    value="RadioButton1" 
    data="1" />

それができれば、あとはラジオボタンの change イベントでクリックされたラジオボタンがある
GridView の列の ProductID 情報を data 属性から取得して Label1 に表示できます。

具体的には、ブログの記事の「2013/8/31 追記」の方の JavaScript / jQuery のコードに以下
のように追加すれば OK です。

$(function () {
    $('#<%=GridView1.ClientID%> input:radio').change(
        function () {
            $('#<%=GridView1.ClientID%> input:radio').
                removeAttr("checked");
            $(this).attr('checked', 'checked');

            // 以下の 2 行を追加
            var id = $(this).attr('data');
            $('#<%=Label1.ClientID%>').html(id);
        });
});

引用返信 編集キー/
■81709 / inTopicNo.5)  Re[4]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ hi (3回)-(2016/10/29(Sat) 17:34:07)
WebSurfer様

とても分かりやすいご説明をして頂き、ありがとうございます!!

サーバ側:
GridView の RowDataBound イベントで、InputAttributes プロパティを使って、ラジオボタンのinput 要素に属性"data"(名称は任意?)を追加しておく

クライアント側:
ラジオボタンの change イベントでボタン押し直しの後、ProductID 情報を data 属性から取得して Label1 に表示する

という手順ですね。
月曜日になりますが、早速、お教え頂いた方法で実装してみたいと思います。
本当にありがとうございます。
また、後ほど結果をご報告に参ります。
引用返信 編集キー/
■81715 / inTopicNo.6)  Re[5]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ hi (4回)-(2016/10/31(Mon) 11:19:03)
WebSerfer様

おかげさまで、お教え頂いた方法でラベルにGridView の値を表示できました!
ありがとうございます!!
今回は、本当に勉強になりました。
教えて頂いた内容をベースに、色々と試してみたいと思います。
重ねてお礼申し上げます。
引用返信 編集キー/
■81719 / inTopicNo.7)  Re[6]: GridView内のラジオボタン変更イベント取得方法
□投稿者/ WebSurfer (1061回)-(2016/10/31(Mon) 13:37:06)
No81715 (hi さん) に返信

解決したそうですので「解決済み」マークを付けておきますね。
解決済み
引用返信 編集キー/


トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

管理者用

- Child Tree -