マルチカラム内の縦向き固定テーブルのデータ構造の変更

最終更新日：2024.09.18 公開日：2023.10.24

マルチカラムの中で縦向き固定テーブルを利用している場合は multiField v2 のフィールドを v3 へアップグレードする前に以下をよくお読みください。

type: 'multi-column' の中に「縦向き固定テーブル」（ type: 'table-vertical-fixed' ）がある場合、下記のように、その縦向き固定テーブル内の各フィールドのデータがマルチカラムのデータ直下に保存されるバグがありました。

// マルチフィールドを適用するコード
(function ($) {
    mtapp.multiField({
        version: 2,
        id: 348,
        label: 'マルチカラム',
        fieldBlocks: {
            tableVerticalFixed: {
                type: 'table-vertical-fixed',
                label: '縦向き固定テーブル',
                data: {},
                fields: ['text', 'select', 'image']
            },
            multiColumn: {
                type: 'multi-column',
                label: 'マルチカラム',
                data: {},
                columns: [{ col: 12, class: '', label: '', description: '', fields: ['h2', 'tableVerticalFixed'] }]
            }
        },
        fieldGroups: [['multiColumn']]
    });
})(jQuery);

// 保存されるデータ
{
  "items": [
    {
      "data": {
        "h2": "見出し",
        "text": "縦向き固定テーブル内１行テキスト",
        "select": "apple",
        "image": {
          "id": "669",
          "url": "/mt7/mtappjquery-qa/tinybeans.png",
          "thumbnail": "/mt7/mtappjquery-qa/assets_c/2023/05/tinybeans-thumb-120xauto-669.png?ts=20230530185852",
          "alt": "縦向き固定テーブル画像alt"
        }
      },
      "handle": "multiColumn",
      "id": "yGLCxkSJ"
    }
  ],
  "version": 2,
  "ts": 1699842128098
}

これをマルチカラムの data の中の縦向き固定テーブルのフィールドハンドル以下に収めるように変更しました。

// マルチフィールドを適用するコード
(function ($) {
    mtapp.multiField({
        version: 3, // 3に変更
        id: 48,
        label: 'マルチカラム',
        fieldBlocks: {
            tableVerticalFixed: {
                type: 'table-vertical-fixed',
                label: '縦向き固定テーブル',
                data: {},
                fields: ['text', 'select', 'image']
            },
            multiColumn: {
                type: 'multi-column',
                label: 'マルチカラム',
                data: {},
                columns: [{ col: 12, class: '', label: '', description: '', fields: ['h2', 'tableVerticalFixed'] }]
            }
        },
        fieldGroups: [['multiColumn']]
    });
})(jQuery);


// 保存されるデータ
{
  "items": [
    {
      "data": {
        "h2": "見出し",
        "tableVerticalFixed": {
          "text": "縦向き固定テーブル内１行テキスト",
          "select": "apple",
          "image": {
            "id": "669",
            "url": "/mt7/mtappjquery-qa/tinybeans.png",
            "thumbnail": "/mt7/mtappjquery-qa/assets_c/2023/05/tinybeans-thumb-120xauto-669.png?ts=20230530185852",
            "alt": "縦向き固定テーブル画像alt"
          }
        }
      },
      "handle": "multiColumn",
      "id": "yGLCxkSJ",
      "expanded": true
    }
  ],
  "version": 2,
  "ts": 1699842128098
}

一度データを開いて保存すると自動でデータのマイグレーションが行われます。「マルチカラム」の中で「縦向き固定テーブル」を利用している場合は、事前にテンプレートを調整してください。