【FormBrige】開始日時に値を入力したら、終了日時に+45分した状態で表示するコードを書きたい

kintone カスタマイズ
1

表題について、FormBrigeで「開始日時に値を入力したら、終了日時に+45分した状態で表示する」コードを書きたいと考えています

いろいろと試してみましたが、要素が見つかりません等のエラーがでて実装できていません。もしわかる方がいたらご教示をお願いします。

2

FormBridge には詳しくないので憶測ではありますが。。。

こちら のイベントで終了時刻を書き換えるようにすればよいかと思います。

3

日付のフィールドで試したことはありませんが、前コメントのリンクで表示されるページの form.field.change.(fieldCode) の項とその例が参考になります。

4

前提

  • 新しいバージョンのフォーム
フィールドコード フィールドタイプ
開始 日時
終了 日時

念のため、終了日時をユーザーが操作できないようにしています。

/**
 * 「終了」フィールドをユーザー操作不可にする
 *
 * @returns {void}
 */
function lockEndField() {
  const field = document.querySelector('.fb-custom--field[data-field-code="終了"]');
  if (!field) return;

  // 入力を無効化
  field.querySelectorAll('input').forEach((input) => {
    input.readOnly = true;
    input.style.pointerEvents = 'none';
  });

  // カレンダー起動用ボタンを無効化
  field.querySelectorAll('button').forEach((button) => {
    button.disabled = true;
  });
}

formBridge.events.on('form.show', lockEndField);

formBridge.events.on('form.field.change.開始', function (context) {
  const startValue = context.value;
  if (!startValue) return;

  const startDate = new Date(startValue);
  const endDate = new Date(startDate.getTime() + 45 * 60 * 1000);

  context.setFieldValue('終了', endDate);
  lockEndField();
});

現時点ではformBridge.fn.updateFieldSetting() で isEditableが操作できないことを知りました。

5

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。