本文へ移動
Wagby11
マニュアルのグループを選ぶ

WAGBY11 MANUAL / 13

ヘルプ・プレースホルダを表示する

入力欄の下に説明を表示し、空欄には入力例を示せます。ラベルや内容部には補足のツールチップも用意できます。

最終更新日:

レイアウトと表示の小目次へ

1. このページで伝える機能

入力欄の下に説明を表示し、空欄には入力例を示せます。ラベルや内容部には補足のツールチップも用意できます。

2. Wagby11で実現できること

作業名とメールアドレスの空欄には入力例、欄の下には用途の説明を表示しています。入力例は値として保存する内容ではありません。

入力例と、入力欄の下の説明文を表示した画面。
入力例と、入力欄の下の説明文を表示した画面。

入力後はプレースホルダが消えますが、ラベルと説明文は残ります。ツールチップは追加説明に使い、入力の意味をツールチップだけに任せない構成にします。

入力後も項目ラベルと説明文を確認できます。
入力後も項目ラベルと説明文を確認できます。

項目群の途中に共通の案内や小見出しを置く場合は、項目の間に見出し・説明文を配置するを参照してください。

3. AIへの指示例

最小限の指示例

メールアドレスに入力例と説明を付け、用途が分かるようにしてください。

AIはどの画面へ説明を出すか、入力例と補足の使い分けを類推して補います。入力後にも残したい説明は、プレースホルダとは分けて伝えます。

より詳細な指示例

LayoutProjectのcreate・updateレイアウトでemailのplaceholderを例)contact@example.com、label.tooltipを作業の連絡を受け取る宛先です。、value.descriptionを作業に関する連絡を受け取るメールアドレスです。にしてください。詳細画面にはplaceholderを指定しません。
既存のモデル・項目・主キー・データ・権限を保持し、Wagby11のguide・referenceを確認してください。メニューと一般利用者向け操作マニュアルを更新し、生成・ビルド完了後に起動して画面と保存結果を確認してください。

4. 編集されるAppSchemaの例

以下は関連する定義の抜粋です。構文を覚えなくても、画面でどう見せたいかをAIへ伝えられます。

fields:
  - name_en: email
    input: { placeholder: 例)contact@example.com }
    presentation:
      label: { tooltip: 作業の連絡を受け取る宛先です。 }
      value:
        description: 作業に関する連絡を受け取るメールアドレスです。

ヘルプや説明は画面配置に記述します。プレースホルダは登録・更新・検索の文字列入力に用い、ラベルや必須表示の代わりにはしません。

5. 参考資料

guide:ヘルプ・プレースホルダを表示する
designer/docs/appschema/html/guide/06-layout/08-help-and-description.html
reference:uidefs画面レイアウト定義
designer/docs/appschema/html/reference/15-ui-layout.html