> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 通常フォーム

> YiDAの通常フォームは、承認フローを伴わずアンケート・オンライン登録・営業報告などの業務データを収集する機能です。PC表示・フォーム検証・イベントなどの基本属性と、送信ボタン・前後処理・データソース制御などのプレミアム属性の設定方法を解説します。

通常フォームは、業務運用中に発生するすべてのデータを収集し、外部ユーザーに公開して外部データを収集することもできます。収集したデータは必要に応じて活用します。

通常フォームには承認フローがありません。アンケート、オンライン登録、営業報告、会議予約、購買入庫記録、注文入力、QRコードチェックインなどのシナリオで利用します。

## 基本属性の設定

* PC表示設定：列数によって、フォーム上のコンポーネントを1列または2列で表示するかを制御します。

* フォーム検証：フォーム検証には数式検証、サービス検証、カスタムコードサービス検証があります。詳細については、フォーム検証を参照してください。

* フォームイベント：詳細については、フォーム業務ルールを参照してください。

## プレミアム属性の設定

### 送信ボタン

送信ボタンの表示テキストを変更します。国際化と変数バインディングに対応しています。

### フォーム送信前

デフォルトでは、フォームデータが検証を通過して設定が完了すると、データはYiDAバックエンドAPIに送信されて保存されます。

「フォーム送信前」オプションを使用すると、デフォルトの送信動作をブロックできます。アクション内で`false`を返すと送信が停止され、後続の動作をカスタマイズできます。

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function beforeSubmit({ formDataMap }){
  // 注意：ここで送信済みデータを変更することはサポートされていません。

  console.log('beforeSubmit', formDataMap);

  // 必要に応じて false を返すと送信をブロックします。Promise にも対応しています。
  // return false;
}
```

`Promise`を返して非同期チェックを実行することもできます：

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function beforeSubmit({ formDataMap }){
  // 注意：ここで送信済みデータを変更することはサポートされていません。
  return new Promise((resolve) => {
  	// 例：データソースをリクエストする
    this.dataSourceMap.someRequest.load().then((res) => {
      if (res) {
        // false を返して送信をブロック
        resolve(false);
      } else {
        resolve();
      }
    });
  });
}
```

お知らせ：`Promise`を返した場合、ボタンの読み込み中状態は`Promise`が解決されるまで継続します。

<Note>
  ここで送信済みデータを変更することはサポートされていません。
</Note>

### フォーム送信後

デフォルトでは、YiDAフォームは送信後にリダイレクトされます。リダイレクト先は、成功お知らせページ（PC）、詳細ページ（モバイル）、またはユーザーが指定したページ（フォーム設定）のいずれかになります。

「フォーム送信後」オプションを使用すると、デフォルトのリダイレクト動作をブロックできます。アクション内で`false`を返すとリダイレクトが停止され、後続の動作をカスタマイズできます。

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function afterSubmit({ submitResult }){
  console.log('afterSubmit', submitResult);

  // 必要に応じて false を返すと後続のアクションをブロックします。Promise にも対応しています。
  // return false;
}
```

`Promise`を返して非同期チェックを実行することもできます：

```javascript theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function afterSubmit({ submitResult }){
  return new Promise((resolve) => {
  	// 例：データソースをリクエストする
    this.dataSourceMap.someRequest.load().then((res) => {
      if (res) {
        // false を返して後続のアクションをブロック
        resolve(false);
      } else {
        resolve();
      }
    });
  });
}
```

お知らせ：`Promise`を返した場合、ボタンの読み込み中状態は`Promise`が解決されるまで継続します。

### フォームデータソース

フォームデータソースは、フォームの値を統一的に制御する方法を提供します。現在は次の2つの目的で使用されます：

* 初期値の提供、つまりフォーム上の各フィールドのデフォルト値を提供します。
* フォームデータソースが変更されると、対応するフォームフィールドの値もそれに応じて更新されます。

例：フォームデータソースでフィールド値を指定します（コピーしてそのまま利用可能）：

```json theme={"theme":{"light":"github-light","dark":"github-dark"}}
{
  "textField_km1nnpxu": "一行テキストの例"
}
```