【フォームブリッジ】条件分岐を設定すると、javascriptが反映されない

[Legacy_Account423 (t.coo（Legacy Account）)]

お世話になります。

以下の投稿を参考に、テーブルのセル幅を調整することができました。

https://developer.cybozu.io/hc/ja/community/posts/360029688031-%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%E3%83%96%E3%83%AA%E3%83%83%E3%82%B8-%E3%83%86%E3%83%BC%E3%83%96%E3%83%AB%E6%A8%AA%E5%B9%85%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6

(function() {
  "use strict";

  const fieldCode = 'list';

  fb.events.form.mounted = [function (state) {
    const field = fb.getElementByCode(fieldCode);
    if (field) {
      const tableElements = field.getElementsByTagName('table');
      if (tableElements && tableElements.length === 1) {
        const tableElement = tableElements[0];
        tableElement.style.width = '100%';
        tableElement.style.tableLayout = 'fixed';
      }
    }

    return state;
  }];
})();

しかし、フォームブリッジの「条件分岐」機能を使うと、上記のjavascriptが適用されず、以下の記事を参考に、色々試してみましたが、解決できず困っております。

https://developer.cybozu.io/hc/ja/community/posts/4403675426201-%E6%9D%A1%E4%BB%B6%E5%88%86%E5%B2%90%E3%81%8C%E3%81%82%E3%82%8B%E4%B8%AD%E3%81%A7%E3%82%82-javascript%E3%82%92%E9%81%A9%E7%94%A8%E3%81%95%E3%81%9B%E3%81%9F%E3%81%84

当方、javascript初心者のため、厚かましいお願いですが、サンプルコードなどでアドバイスいただければ大変助かります。宜しくお願い致します。

 

[Legacy_Account2229 (koichi（Legacy Account）)]

t.cooさん

こんにちは。

 

初期画面では、テーブルは非表示の状態でしょうか。

上記コードですと、テーブルが非表示のときにテーブルの要素が取れずに if (field) の判定がfalseになります。

そのため、styleの設定が反映できていません。

 

少し書き方を変えます。

テーブルが1つであれば、以下のコードでstyleを反映できます。

テーブルが複数ある場合は、[0]の番号が変わってきます。

(function() {

  'use strict';

    fb.events.form.mounted = [function(state) {
      const tableElement = document.getElementsByTagName('table')[0];
        tableElement.style.width = '100%';
        tableElement.style.tableLayout = 'fixed';
      return state;
  }];

})();

[Legacy_Account423 (t.coo（Legacy Account）)]

**koichi**さま

サンプルコードありがとうございます。
初期画面では、テーブルは非表示の状態です。

テーブルは1つでしたので、いただきましたコードそのまま使用することができ、
レイアウトも望み通りのものにすることができました。

前回に続き、ありがとうございます。
大変助かりました。m(_ _)m