ホーム > .NET, ASP.NET 備忘録 > 複数行のデータを表示/編集できるGridView

複数行のデータを表示/編集できるGridView

データに改行している箇所があっても、標準のGridViewではその改行は無視されて表示されてしまいます。これは、HTMLが改行コードを無視するためなので、改行コードをbrタグに置き換えてあげる必要があります。
GridViewにそのような機能を追加してみます。

01

ここではデータベースに主キーとなるidと文字列testDataだけのテーブルを作成しています。また、あらかじめいくつかのデータをこのテーブル内に作成しておきます。
データベースエクスプローラから作成したテーブルをページにドラッグ アンド ドロップすると、GirdView1とSqlDataSource1が作成されます。GridView1の「ページングを有効にする」と「編集を有効にする」にチェックを入れます。

02

GridView1のtestDataフィールドをTemplateFieldに変換します。テンプレートの編集でtestDataフィールドのEditItemTemplateを表示し、この中に存在しているTextBoxのTextModeプロパティをMultiLineに設定します。必要であれば、Rowsプロパティの行数も調整します。

03

テンプレートの編集を終了します。
GridView1のプロパティウィンドウにイベントを表示し、PreRenderイベントをダブルクリックします。GridView1_PreRenderメソッドが自動的に生成されるので、以下の通りに記述します。

    protected void GridView1_PreRender(object sender, EventArgs e)
    {
        foreach (TableRow r in ((GridView)sender).Rows)
            foreach (TableCell tc in r.Cells)
                foreach (Control c in tc.Controls)
                   if (c is Label)
                        ((Label)c).Text = ((Label)c).Text.Replace(Environment.NewLine, "<br />");
    }

ここではGridView1がHTMLに変換される(レンダリング)前に自身が持つ行、列、とたどっていって、列の中にLabelコントロールがあったらその中のテキストデータの改行コード(Environment.NewLine)をbrタグに置き換える、という処理を行っています。
テンプレートの編集でItemTemplateをLabel以外のものに変更しているような場合はこのコードをそれにあわせて修正する必要があります。

デバッグを開始し、GridViewが改行を含んだデータを正しく表示していること、またそのデータを更新できることを確認してください。

04

カテゴリー:.NET, ASP.NET 備忘録
  1. まだコメントはありません。
  1. No trackbacks yet.

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。