DevExpress でのリボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)に対してDB読み込みサンプル作成手順です。
今回は、「XPO」でDBアクセスしますのでサンプル作成までの手順は6点です。
・プロジェクト作成(DevExpress v19.2 Template Gallery)
・データ構造作成(ORMDataModel)
・リボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)生成
・XPO作成(XpoDataSource)
・リボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)設定
・セッション設定
<リボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)に対してDB読み込みサンプル作成(Visual Studio 2019)>
Visual Studio 2019 を起動し、「新しいプロジェクトの作成」をクリックします。
プロジェクト作成のため、「Visual Basic」、「Windows」、「Web」から「DevExpress v19.2 Template Gallery」を選択します。
プロジェクト内容を入力し、「作成」ボタンをクリックします。
「Empty Web Application」を選択し、「Create Project」ボタンをクリックします。
「Empty」を選択し、「Create Project」ボタンをクリックします。
↓
コンテキストメニューから「追加」→「新しい項目」を選択します。
↓
「Visual Basic」→「Web」から「Web フォーム」を選択し、「追加」ボタンをクリックします。
コンテキストメニューから「追加」→「新しい項目」を選択します。
↓
「Visual Basic」→「DevExpress」から「DevExpress ORM Data Model Wizard」を選択し、「追加」ボタンをクリックします。
「Map to an existing database」を選択し、「次へ」ボタンをクリックします。
※既存のテーブルを使用するため、「Map to an existing database」を選択。
「Database」の接続情報を入力し、「次へ」ボタンをクリックします。
不要なテーブルを除外(チェックOFF)し、「次へ」ボタンをクリックします。
↓
「完了」ボタンをクリックします。
↓
テーブルクラスを作成するために、コンパイルを行います。
リボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)作成を行います。
ツールボックスの「DX.19.2:ORM Components」から「XpoDataSource」をドラッグして指示します。
※「DX.19.2」はDevExpressのバージョンです。
「XpoDataSource」に対して「TypeName=”Sample_12.ORACLEDB.TABLEKEN”」を設定します。
「ASPxRibbon」のコンテキストメニューから「Designer」を選択します。
↓
「タブ_01」、「グループ_01_01」を展開し、「combobox_01_01_02」を選択します。
プロパティータブから「Combo Box Properties」を選択します。
「ASPxRibbon」、「Tabs」、「RibbonTab」、「groups」、「RibbonGroup」、「Items」、「RibbonComboBoxItem」の「PropertiesComboBox」に対して「DataSourceID=”XpoDataSource1″」を設定します。
「ASPxRibbon」、「Tabs」、「RibbonTab」、「groups」、「RibbonGroup」、「Items」、「RibbonComboBoxItem」の「PropertiesComboBox」に対して「TextField=”KENCYO_KANN”」を設定します。
「ASPxRibbon」、「Tabs」、「RibbonTab」、「groups」、「RibbonGroup」、「Items」、「RibbonComboBoxItem」の「PropertiesComboBox」に対して「ValueField=”ID”」を設定します。
【サンプルプログラム】
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 |
<form id="form1" runat="server"> <div> <dx:ASPxRibbon ID="ASPxRibbon1" runat="server" ShowFileTab="False" Theme="RedWine"> <Tabs> <dx:RibbonTab Name="タブ_01" Text="タブ_01"> <groups> <dx:RibbonGroup Name="グループ_01_01" Text="グループ_01_01"> <Items> <dx:RibbonComboBoxItem Name="combobox_01_01_01" Text="コンボボックス_01_01_01"> <Items> <dx:ListEditItem Text="アイテム_01" Value="1" /> <dx:ListEditItem Text="アイテム_02" Value="2" /> <dx:ListEditItem Text="アイテム_03" Value="3" /> </Items> </dx:RibbonComboBoxItem> <dx:RibbonComboBoxItem Name="combobox_01_01_02" Text="コンボボックス_01_01_02"> <PropertiesComboBox DataSourceID="XpoDataSource1" TextField="KENCYO_KANN" ValueField="ID"> </PropertiesComboBox> </dx:RibbonComboBoxItem> </Items> </dx:RibbonGroup> </groups> </dx:RibbonTab> </Tabs> </dx:ASPxRibbon> </div> <div> <dx:XpoDataSource ID="XpoDataSource1" runat="server" TypeName="Sample_12.ORACLEDB.TABLEKEN"></dx:XpoDataSource> </div> </form> |
ソリューションエクスプローラーから「Global.asax」を選択します。
「Application_Start」メソッドで「DevExpress.Xpo.XpoDefault.DataLayer」の接続と「DevExpress.Xpo.XpoDefault.Session」の初期化を行います。
【サンプルプログラム(VB.net)】
1 2 3 4 5 |
Sub Application_Start(ByVal sender As Object, ByVal e As EventArgs) AddHandler DevExpress.Web.ASPxWebControl.CallbackError, AddressOf Application_Error DevExpress.Xpo.XpoDefault.DataLayer = ORACLEDB.ConnectionHelper.GetDataLayer(DevExpress.Xpo.DB.AutoCreateOption.SchemaAlreadyExists) DevExpress.Xpo.XpoDefault.Session = Nothing End Sub |
ソリューションエクスプローラーから「WebForm1.aspx」を選択します。
「Init」メソッドで「XpoDataSource1.Session」に「Session」設定します。
【サンプルプログラム(VB.net)】
1 2 3 |
Private Sub WebForm1_Init(sender As Object, e As EventArgs) Handles Me.Init XpoDataSource1.Session = New DevExpress.Xpo.Session End Sub |
それでは、実行して動作確認を行います。
↓
↓
無事、リボン(ASPxRibbon)のコンボボックス(RibbonComboBoxItem)に対してDB読み込みサンプル作成が出来ました。
項目に検索キーワードを入力すると一覧から検索することも可能です。