Skip to main content

 

 

 

 

Template:OutSystems/Documentation_KB/Breadcrumb_New_Layout

 

 

Template:OutSystems/OSLanguageSwitcher

 

モバイルアプリとリアクティブWebアプリにのみ適用されます

 

 

OutSystems

Date Picker

Date Picker UIパターンを使用すると、ユーザーがカレンダーを使用して単一の日付または日付の範囲を選択することができます。

Date Picker UIパターンの使用方法

  1. Service StudioのツールボックスでDate Pickerを検索します。

    Date Pickerウィジェットが表示されます。

  2. ツールボックスから、Date Pickerウィジェットをアプリケーション画面のメインコンテンツ領域にドラッグします。

    Properties]タブで、イベントを作成するように促すプロンプトが表示されます。

  3. 選択された日付にアクセスするには、 startDateへの割り当てを作成する必要があります(SelectIntervalがFalseの場合)。

  4. 変数PickedDateのデフォルト値をCurrDateTime()に設定します。

Result

選択した日のイベントを一覧表示する

  1. イベントのリストを配置する領域を設定します。

  2. DateTimeアトリビュートのエンティティを作成します。

  3. マッピングする適切なアトリビュートを使用して、eventListのEventListパラメータにエンティティを設定します。

  4. ページにリストを追加します。

  5. 新しいローカル変数を作成します。

  6. Eventsに対する別のAggregateを取得し、Aggregateにフィルタ「DateTimeToDate(Events.DateTime) = Date」を設定します。

Result

プロパティ

プロパティ 説明
InputWidgetId(Text型): 必須 要素の表示をトリガーするInput要素のID。
ButtonWidgetId(Text型):オプション 要素の表示をトリガーする要素名(例: button)。
EventList(Date Time List型):オプション 日付をイベント日として強調表示するために使用するDateTimeレコードのリストを受け取ります。
MinDate(Date Time型):オプション この日付より前の日は無効になります。
MaxDate(Date Time型):オプション この日付より後の日は無効になります。
InitialDate(Date Time型):オプション Date Pickerの初期選択日。未設定の場合は、デフォルトで現在の日付になります。
ShowWeekNumbers(Boolean型):オプション Trueの場合、Date Pickerの左側に週番号が表示されます。Falseの場合、週番号は表示されません。これがデフォルトです。
FirstWeekDay(Integer型):オプション 最初に表示する曜日を定義します。
  • 0:日曜日
  • 1:月曜日(デフォルト)
  • 2:火曜日
  • 3:水曜日
  • 4:木曜日
  • 5:金曜日
  • 6:土曜日
ShowTime(Boolean型):オプション Trueの場合、Date Pickerの下に時刻ピッカーが表示されます。Falseの場合、時刻ピッカーは表示されません。これがデフォルトです。
Show24HourFormat(Boolean型) Trueの場合、時刻ピッカーは24時間形式で表示されます。これがデフォルトです。Falseの場合、時刻ピッカーは12時間形式で表示されます。
DisabledDaysList(Date Time List型):オプション Date Pickerで無効となるDateTimeレコードのリストを受け取ります。このパラメータが未設定の場合は、MinDateとMaxDateの間のすべての日付けが有効になります。デフォルト値はありません。
DisabledWeekDays(Text型):オプション 無効な曜日を含む文字列。
  • 0: 日曜日
  • 1:月曜日
  • 2:火曜日
  • 3:水曜日
  • 4:木曜日
  • 5:金曜日
  • 6:土曜日


  • 空白 - すべての曜日が有効になります。
  • "0,5" - 日曜日と金曜日が無効になります。
SelectInterval(Boolean型):オプション 2つの日付の間を選択することができます。Trueの場合、ブロックのイベント「On Select」は両方のパラメータの値を持ちます。
StartEmpty(Boolean型):オプション Date Pickerの最初の入力を空にするかどうかを定義します。
DateFormat(Text型):オプション サーバー構成で定義された日付形式をデフォルトに設定します。デフォルトはサーバーの日付形式です。



  • DD/MM/YYYY - 15/05/2020
  • MM/DD/YYYY - 05/15/2020
  • DD MMM YYYY - 15 May 2020
ShowTodayButton(Boolean型):オプション Trueの場合、[Today]ボタンが表示されます。Falseの場合、[Today]ボタンは表示されません。これがデフォルトです。
AdvancedFormat(Text型):オプション 入力によって提供されるもの以外の追加オプションを使用できます。
  • Was this article helpful?