PowerTools InputMan for ASP.NET 8.0J
ドロップダウン機能

日付時刻コントロールに搭載されるドロップダウンボタンを押下すると、キーボードを使用しない入力を補助するドロップダウンオブジェクトが表示されます。日付時刻コントロールにドロップダウン表示可能なオブジェクトは以下の3つです。 詳細については、次のリンク先を参照してください。
ドロップダウン機能を有効にする

DropDownプロパティが参照するDateDropDownオブジェクトは、コントロール上にドロップダウンボタンを表示させます。ドロップダウンボタンをクリックするか、キーボードで[Alt]+[↓]キーを押下することで、日付入力用のドロップダウンオブジェクトを表示できます。

また、ショートカットエクステンダには、デフォルトで[F7]キーがドロップダウン動作に割り当てられています。
ドロップダウン機能を有効にするには、DateDropDownオブジェクトのEnabledプロパティをTrueに設定します。次に、Visibleプロパティを設定してドロップダウンボタンを表示させます。

次のサンプルコードは、日付時刻コントロールにドロップダウンボタンを設定する方法を示します。

GcDateTime1.DropDown.Enabled = True
GcDateTime1.DropDown.Visible = True
GcDateTime1.DropDown.Enabled = true;
GcDateTime1.DropDown.Visible = true;

なお、ドロップダウン機能を使用しない場合は、DateDropDown.EnabledプロパティをFalseに設定します。これにより、実行時にドロップダウンオブジェクトを形成するためのHTML生成やJSファイルの読み込みを回避することができるため、パフォーマンスが向上します。
クライアント側で、DropDownオブジェクトのEnabledプロパティがTrueに切り替えられたとき、必要となるドロップダウンオブジェクトのJSファイルは動的にダウンロードされます。
ドロップダウンオブジェクトの種類

日付時刻コントロールに表示可能なドロップダウンオブジェクトは以下の3種類で、どのドロップダウンオブジェクトを表示するかはDateDropDownクラスのDropDownTypeプロパティを使用して設定します。既定値はDateDropDownType.Calendarです。

DropDownTypeの値 表示されるドロップダウンオブジェクト
Calendar ドロップダウンカレンダー
NumericPad ドロップダウン数値パッド
Picker ドロップダウン日付時刻ピッカー

次のサンプルコードは、日付時刻コントロールのドロップダウンオブジェクトに日付時刻ピッカーを指定します。
GcDateTime1.DropDown.DropDownType = GrapeCity.Web.Input.IMDate.DateDropDownType.Picker
GcDateTime1.DropDown.DropDownType = GrapeCity.Web.Input.IMDate.DateDropDownType.Picker;


ページロード時にダウンロードされるドロップダウンオブジェクトの種類は、サーバー側DropDownTypeプロパティの初期設定に依存します。
クライアント側でDropDownTypeプロパティが変更された場合は、変更後のドロップダウンオブジェクトに必要となるJSファイルが動的にダウンロードされます。
ドロップダウンボタンのカスタマイズ
DateDropDownオブジェクトを使用して、下記のドロップダウンボタンのカスタマイズが可能です。

次のサンプルコードは、ドロップダウンボタンをカスタマイズする例です。

Imports GrapeCity.Web.Input.Core

GcDateTime1.DropDown.AutoDropDown = True
GcDateTime1.DropDown.DropDownShadow = True
GcDateTime1.DropDown.Position = ButtonPosition.Outside
GcDateTime1.DropDown.ClosingAnimation = DropDownAnimation.Scroll
GcDateTime1.DropDown.OpeningAnimation = DropDownAnimation.Fade
GcDateTime1.DropDown.ButtonImage = "~/Images/DropDown.png"
GcDateTime1.DropDown.PressedButtonImage = "~/Images/PressedDropDown.png"
using GrapeCity.Web.Input.Core;

GcDateTime1.DropDown.AutoDropDown = true;
GcDateTime1.DropDown.DropDownShadow = true;
GcDateTime1.DropDown.Position = ButtonPosition.Outside;
GcDateTime1.DropDown.ClosingAnimation = DropDownAnimation.Scroll;
GcDateTime1.DropDown.OpeningAnimation = DropDownAnimation.Fade;
GcDateTime1.DropDown.ButtonImage = "~/Images/DropDown.png";
GcDateTime1.DropDown.PressedButtonImage = "~/Images/PressedDropDown.png";

また、TouchDropDownScaleプロパティを使用して、タッチ操作時のドロップダウンカレンダーの拡大倍率を設定することができます。詳細については「ドロップダウンウィンドウの拡大表示」を参照してください。
参照

 

 


© 2005-2015 GrapeCity inc. All rights reserved.