バージョン

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

始める前に

WebDataGrid™ のいくつかのデフォルト エディターはアプリケーションで役に立たない場合があります。ただし、 EditorProviders コレクションを使用することによって、列に最も役に立つことを証明するエディターを指定できます。

達成すること

編集のために DateTime 列で DatePickerProvider を使用する方法を学習します。

次の手順を実行します

  1. WebDataGrid を SqlDataSource コンポーネントにバインドして、Orders テーブルからデータを取得します。OrderID、CustomerID、OrderDate、および RequiredDate フィールドを取得します。実行についての詳細は、 WebDataGrid で開始を参照してください。

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

  3. + ボタンをクリックして、可能なエディターのリストをドロップダウンします。ひとつを選択して、列を設定する時に後で使用可能にします。このために、DatePickerProvider を選択します。

  4. 右のプロパティ グリッドでエディターの ID を DatePickerProvider1 のままにしておきます。この ID は列のエディターを設定するときに後で必要になります。 EditorControl プロパティを展開することによって、エディター コントロールの追加プロパティを設定できます。

WebDataGrid Using Editor Providers 01.png

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

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

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

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

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

    1. [追加] ボタンをクリックして列設定を追加します。

    2. ColumnKey を RequiredDate として設定します。

    3. EditorID プロパティで、ドロップダウン リストをクリックして DatePickerProvider1 を選択します。EditorProviders コレクションに追加したエディターのみがここで使用できます。

    4. ReadOnly を False のままにしておきます。

    5. [OK] をクリックします。

注： ドロップダウン リストで [列の追加/修正] オプションを選択して、[グリッド列の編集] に移動することもできます。

WebDataGrid Using Editor Providers 02.png

  1. [適用] そして [OK] をクリックしてダイアログを閉じます。

コードで上記の手順を実行することも可能です。

Visual Basic の場合：

' セル編集を有効にします
Me.WebDataGrid1.Behaviors.CreateBehavior(Of EditingCore)()
Me.WebDataGrid1.Behaviors.EditingCore.Behaviors.CreateBehavior(Of CellEditing)()
' エディター プロバイダーを作成します
Dim datePickerProvider As New DatePickerProvider()
datePickerProvider.ID = "DatePickerProvider1"
' コレクションに追加します
Me.WebDataGrid1.EditorProviders.Add(datePickerProvider)
' 列設定を作成してエディター プロバイダーを使用します
Dim columnSetting As New EditingColumnSetting()
columnSetting.ColumnKey = "RequiredDate"
' 使用する列のためのエディターを割り当てます
columnSetting.EditorID = datePickerProvider.ID
' 列設定を追加します
Me.WebDataGrid1.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(columnSetting)

C# の場合：

// セル編集を有効にします
this.WebDataGrid1.Behaviors.CreateBehavior<EditingCore>();
this.WebDataGrid1.Behaviors.EditingCore.Behaviors.CreateBehavior<CellEditing>();
// エディター プロバイダーを作成します
DatePickerProvider datePickerProvider = new DatePickerProvider();
datePickerProvider.ID = "DatePickerProvider1";
// コレクションに追加します
this.WebDataGrid1.EditorProviders.Add(datePickerProvider);
// 列設定を作成してエディター プロバイダーを使用します
EditingColumnSetting columnSetting = new EditingColumnSetting();
columnSetting.ColumnKey = "RequiredDate";
// 使用する列のためのエディターを割り当てます
columnSetting.EditorID = datePickerProvider.ID;
// 列設定を追加します
this.WebDataGrid1.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(columnSetting);

  1. アプリケーションを実行します。RequiredDate 列のセルで編集モードになると、DatePickerEditor が表示します。

WebDataGrid Using Editor Providers 03.png

注: DatePicker を使用する場合、バインドされたフィールドが完全な DateTime オブジェクトを渡し DatePicker カレンダーから新しい日付を選択すると、 DateTime オブジェクトの時間部分が新しく選択された日付の開始時刻に変更されます [2016/08/20 午前 00:00:00]。

完全な DateTime オブジェクトは値の日付と時間部分を含みます。 例: 2009/0８/19 日曜日 1:48:29

注: DateTimeEditorProvider を使用する場合、値を変更した場合もプロバイダーの EditModeFormat 文字列に関係なく、DateTime オブジェクトが保持されます。