バージョン

WebDataGrid のエディター プロバイダーとして WebDropDown を使用

始める前に

WebDropDown™ は、すべての他の WebDropDown 機能と共にセル値の項目のドロップダウン リストを表示するために WebDataGrid™ 用のエディター プロバイダーとして使用できます。

達成すること

WebDataGrid で DropDownProvider として WebDropDown を使用する方法を学びます。

次の手順を実行します

  1. Visual Studio™ ツールボックスから、ScriptManager コンポーネント、SqlDataSource コンポーネントおよび WebDataGrid コントロールをフォームにドラッグ アンド ドロップします。

  2. SqlDataSource1 を使用して Northwind データベースの Products テーブルの ProductID、ProductName、SupplierID、CategoryID および QuantityPerUnit に WebDataGrid を バインドします。実行についての詳細は、 「WebDataGrid を SQL データ ソースにバインド」を参照してください。

  3. Visual Studio プロパティ ウィンドウで、 EditorProviders プロパティを指定して、省略記号 (…​) ボタンをクリックし、[グリッド エディター プロバイダー デザイナーの編集] を起動します。

  4. + ボタンをクリックし、使用できるエディター プロバイダーのドロップダウン リストから DropDownProvider を選択します。

  5. DropDownProvider1 としてエディターの ID をそのままにしておきます。この ID は列のエディターを設定するときに後で必要になります。

WebDataGrid Using WebDropDown as an editor provider for WebDataGrid 01.png
  1. EditorControl プロパティを展開して、以下のプロパティを設定します。

プロパティ

DataSourceID

SqlDataSource1

DropDownOrientation

BottomLeft

TextField

ProductName

ValueField

ProductID

  1. [適用] と [OK] をクリックしてデザイナーを閉じます。

  2. Behaviors プロパティを指定して、省略記号 (…​) ボタンをクリックし、[グリッド動作の編集] ダイアログを起動します。

  3. 編集を有効にするには左のリストで Cell Editing 動作チェックボックスをチェックします。

  4. 右のプロパティ グリッドで ColumnSettings プロパティを指定して、省略記号 (…​) ボタンをクリックして、[列設定] ダイアログを起動します。

  5. WebDataGrid を構成して ProductName 列の編集のために DropDownProvider を使用します。

    • [項目の追加] ボタンをクリックして列設定を追加します。

    • ProductName として ColumnKey プロパティを設定します。

    • EditorID プロパティを使用できるプロバイダーのドロップダウン リストから DropDownProvider1 に設定します。

    • [適用] と [OK] ボタンをクリックして [列設定] ダイアログを閉じます。

    • [適用] と [OK] をクリックして [グリッド動作の編集] ダイアログを閉じます。

WebDataGrid Using WebDropDown as an editor provider for WebDataGrid 02.png
  1. アプリケーションを保存して実行します。ProductName 列のセルが編集モードになると、以下の画像のように項目のドロップダウン リストが表示されることがわかります。

WebDataGrid Using WebDropDown as an editor provider for WebDataGrid 03.png