ActionCenterのタスク上で編集グリッドの列幅を変更したい

:grey_question: Question

『フォーム タスクを作成』アクティビティを利用してAction Centerのタスクを作成するワークフローを作成しています。

フォーム デザイナー上、編集グリッドを実装しています。既定では表示時の列幅が均等になっていますが、(例えばpx値で指定するなど)特定の列の幅を変更したいです。

下記リンクに記載しているBootstrap3、styleプロパティ両方試しましたがセル幅が変更されませんでした。

参考:
編集グリッドの列幅をカスタマイズする

:bulb: Answer

Action Centerのフォームタスクは通常のフォームアクティビティのフォームデザイナーと違いがあり、そのため上記リンクのBootstrap3、styleプロパティが想定通りに機能しない可能性があります。

2023年8月時点の仕様では、列幅をpx値で指定が機能しないため、回避策としてパーセンテージで調整する方法をご利用ください。

下記手順でAction Centerのタスク上に表示する表の列幅を調整できます。

1.フォーム デザイナーを開き、「編集グリッド」の上に「HTML要素」をドラッグアンドドロップします。

2.「HTML要素」の編集画面を開き、[表示]タブの配下の[コンテンツ]に下記スクリプトを入れます。

=========

.formio-component-inout_sampleDt .row div:nth-child(2) { min-width: 50%; }

=========

nth-child(2)の中の2は、変更したい列の番号を表しています(番号は1から始まります)。min-widthの項目にピクセル(px)の調整が効かないため、代わりにパーセンテージで設定します。これは、その列が表全体の幅に対して占める割合を意味します。例えば、上記のスクリプトは「2番目の列を表全体の50%の幅にする」という設定です。

上記設定を適用後、作成されたタスクの表示は下記画像のようになります。