ASPxGridViewを利用する場合は、一般的には固定化されたデータソースを利用するが
画面を複数用意しなければならず。コード量が増えるので、処理を共通化しデータソースを動的に変更できないか検証してみた。
検証の際、検索やソートがうまく動作せず苦労したが、DevExpress社のQ&Aなどを参考に、
正常に動作確認できたので、その際のメモ
処理概要
・ASPxGridViewにデータバインド時のイベント処理メソッドを追加
・ページの初期化タイミングで、DataBind()を呼び出す
・データバインド時のイベント処理メソッド内で、データソースの生成とカラムの生成を行う
ソースの解説
DefaultForm.aspx
ASPxGridViewにデータバインド時のイベント処理メソッドを追加する。
カラムは動的に生成するので作成しない
1 2 3 4 5 6 7 8 9 10 11 |
<dx:ASPxGridView ID="GridViewDatas" ClientInstanceName="GridViewDatas" OnDataBinding="OnDataBinding" AutoGenerateColumns="False" runat="server" Width="100%" Theme="Moderno" KeyFieldName="gid"> <Paddings Padding="20" /> <SettingsSearchPanel Visible="true" /> <Settings GridLines="Both" ShowGroupPanel="false" ShowFilterRow="false" /> <SettingsBehavior AllowSelectByRowClick="true" AllowFocusedRow="True" AllowSort="true" /> <ClientSideEvents RowDblClick="OnRowDbClick" RowClick="OnRowClick"/> </dx:ASPxGridView> |
DefaultForm.aspx.cs
ページの初期化タイミングで、DataBind()を呼び出す。
データバインド時のイベント処理メソッド内で、データソースの生成とカラムの生成を行う
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 |
public partial class DefaultForm : System.Web.UI.Page { protected void Page_Init(object sender, EventArgs e) { var commandName = this.Session["CommandName"] + ""; if (commandName == "SelectItem") { this.LoadDataList(); } } public void LoadDataList() { this.GridViewDatas.DataBind(); } protected void OnDataBinding(object sender, EventArgs e) { var selectedItem = Session["SelectedItem"] + ""; this.SetDataSource(selectedItem); this.AddColumns(selectedItem); } protected void SetDataSource(string selectedItem) { if (selectedItem == "map") { var maps = mapDao.GetMaps(); this.GridViewDatas.DataSource = maps; } else if (selectedItem == "layer") { var layers = layerDao.GetLayers(); this.GridViewDatas.DataSource = layers; } } protected void AddColumns(string selectedItem) { this.GridViewDatas.Columns.Clear(); if (selectedItem == "map") { this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "RowNo", Caption = "No" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "MapId", Caption = "地図ID" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "MapName", Caption = "地図名" }); this.GridViewDatas.Columns.Add(new GridViewDataImageColumn() { FieldName = "ThumbnailUrl", Caption = "サムネイル" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "Center", Caption = "中心地" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "UpdUser", Caption = "更新者" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "UpdTs", Caption = "更新日時" }); } else if (selectedItem == "layer") { this.GridViewDatas.KeyFieldName = "LayerId"; this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "RowNo", Caption = "No" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "LayerId", Caption = "レイヤID" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "LayerName", Caption = "レイヤ名" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "LayerType", Caption = "レイヤ種別" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "GeometryType", Caption = "図形種別" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "UpdUser", Caption = "更新者" }); this.GridViewDatas.Columns.Add(new GridViewDataTextColumn() { FieldName = "UpdTs", Caption = "更新日時" }); } } } } |
ソート後の画面のイメージ
正常にソートができている!