none
データテーブルにイメージフィールドを設定してGridViewに画像を表示させたいのですが RRS feed

  • 質問

  • いつもお世話になっております。今日は、データテーブルとGridViewの使い方で教えていただきたいことがあります。

     

    以下のようなコードを書いてみました。

     

            Dim DT as DataTable = New DataTable

            With DT.Columns
                .Add("項目1", GetType(String))
                .Add("項目2", GetType(String))
                .Add("ロゴイメージ", GetType(ImageField))
            End With

            Dim dr As DataRow = DT.NewRow
            dr(0) = "加工後の項目1データ"

            dr(1) = "加工後の項目2データ"
            Dim imgimg As ImageField = New ImageField
            imgimg.DataImageUrlField = "..\img\image.gif
            imgimg.DataImageUrlFormatString = "{0}"
            dr(2) = imgimg
            

            DT.Rows.Add(dr)
           
            With GridView
                .DataSource = DT
                .DataBind()
            End With

    画面デザイン時にはGridViewの項目は全く編集せず、データテーブルで様々なデータを編集した後、データテーブルを作成して、その内容をそのままGridViewにバインドして表示させたいと考えております。

     

    画面デザイン時にGridViewの項目をあらかじめ編集しておくとうまくいくのですが、ランタイム時に設定して表示させるという方法がどうもうまくいきません。

    http://msdn.microsoft.com/library/ja/default.asp?url=/library/ja/jpdnvs05/htm/ASP2.0/gridview/GridViewEx06.asp

    この資料を見たり、いろいろ自分なりに調べてみたのですが、どうにも解決策が見つかりませんでした。

     

    いつも、勉強不足だったり、変な質問だったりで大変恐縮ですが、もし、良い方法をご存じの方がいらっしゃいましたら、教えていただけますでしょうか?何卒よろしくお願いします。

    2007年11月22日 13:19

回答

  • ImageFieldはGridViewの列です。したがってGridViewで自動生成された列に列を放り込むのはおかしな考えです。もし、その考え方に当てはめるのであれば、データテーブルの他の列も、StringではなくStringFieldになります。もちろん、StringFieldは実際にはありません。

     

    さて、AutoGenerateColumns = True の状況でどのように対処するかを考えてみたのですが、とりあえず以下のテストコードを書いてみました。

     

    コード ブロック

        Dim imageColumnIndex As Integer

     

        Protected Sub cbtn_bind_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles cbtn_bind2.Click
            Dim DT As DataTable = New DataTable

            With DT.Columns
                .Add("項目1", GetType(String))
                .Add("項目2", GetType(String))
                .Add("ロゴイメージ", GetType(String))
            End With

            Dim dr As DataRow = DT.NewRow
            dr(0) = "加工後の項目1データ"
            dr(1) = "加工後の項目2データ"
            dr(2) = "<img src=""./image/hoge.gif"" />"

            DT.Rows.Add(dr)

     

            imageColumnIndex = 2

     

            With GridView1
                .DataSource = DT
                .DataBind()
            End With
        End Sub

     

        Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

     

           If e.Row.RowType = DataControlRowType.DataRow Then
                e.Row.Cells(imageColumnIndex).Text = Server.HtmlDecode(e.Row.Cells(imageColumnIndex).Text)
            End If
        End Sub  

     

     

     

    2007年11月22日 16:23
    モデレータ

すべての返信

  • 以下のような感じで。

     

    変更した点は、データテーブルのロゴイメージ列はStringで。(イメージのパスを格納します)

    またAutoGenerateColumnではイメージフィールドを生成してくれないので、マニュアルで生成します。

    そのイメージフィールドのDataImageUrlFieldにデータテーブルのイメージのパスが格納された列を指定します。

     

    コード ブロック

    Dim DT As DataTable = New DataTable

            With DT.Columns
                .Add("項目1", GetType(String))
                .Add("項目2", GetType(String))
                .Add("ロゴイメージ", GetType(String))
            End With

            Dim dr As DataRow = DT.NewRow
            dr(0) = "加工後の項目1データ"
            dr(1) = "加工後の項目2データ"
            dr(2) = ResolveUrl(".\img\img.gif")

            DT.Rows.Add(dr)

            With GridView1
                Dim f As New System.Web.UI.WebControls.ImageField()
                f.DataImageUrlField = "ロゴイメージ"
                .Columns.Add(f)

                .DataSource = DT
                .DataBind()
            End With

     

     

    ただし、このままでは、パスも表示されます。
    2007年11月22日 15:05
  • ImageFieldはGridViewの列です。したがってGridViewで自動生成された列に列を放り込むのはおかしな考えです。もし、その考え方に当てはめるのであれば、データテーブルの他の列も、StringではなくStringFieldになります。もちろん、StringFieldは実際にはありません。

     

    さて、AutoGenerateColumns = True の状況でどのように対処するかを考えてみたのですが、とりあえず以下のテストコードを書いてみました。

     

    コード ブロック

        Dim imageColumnIndex As Integer

     

        Protected Sub cbtn_bind_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles cbtn_bind2.Click
            Dim DT As DataTable = New DataTable

            With DT.Columns
                .Add("項目1", GetType(String))
                .Add("項目2", GetType(String))
                .Add("ロゴイメージ", GetType(String))
            End With

            Dim dr As DataRow = DT.NewRow
            dr(0) = "加工後の項目1データ"
            dr(1) = "加工後の項目2データ"
            dr(2) = "<img src=""./image/hoge.gif"" />"

            DT.Rows.Add(dr)

     

            imageColumnIndex = 2

     

            With GridView1
                .DataSource = DT
                .DataBind()
            End With
        End Sub

     

        Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

     

           If e.Row.RowType = DataControlRowType.DataRow Then
                e.Row.Cells(imageColumnIndex).Text = Server.HtmlDecode(e.Row.Cells(imageColumnIndex).Text)
            End If
        End Sub  

     

     

     

    2007年11月22日 16:23
    モデレータ
  • 投稿後に素早くご提案いただきまして誠にありがとうございます。出張に行ったり悩んだりしているうちにだいぶ時間が過ぎてしまいました。感謝を申し上げるとともにお詫び申し上げます。

     

    2007年11月30日 15:22
  • 投稿後に素早くご提案いただきまして誠にありがとうございます。出張に行ったり悩んだりしているうちにだいぶ時間が過ぎてしまいました。感謝を申し上げるとともにお詫び申し上げます。

     

     

    また、見事な解決策をご提案いただき大変感謝しております。

     

    この方法はシンプルで斬新かつ明快な方法だと思います。全く思いつかなかったというか理解不足というか、さらなる技術向上に努めたいと思います。

     

    今回の件では大変お世話になりました。誠にありがとうございます。また、今後とも何卒よろしくお願いします。

    2007年11月30日 15:27