追加ボタンで入力された値がchangeに反応しない

[futamu]

作業工数を登録するアプリに終了時間を追加ボタンで現在の時間を入力するjavascriptと開始時間と終了時間から工数を計算する(昼休憩をまたぐときは休憩時間を除いた時間にする)javascriptとLuxonの3つを入れております。

終了時間に現在時刻を入力することはできたのですが、工数を計算する方の"app.record.edit.change.{終了時間のフィールドコード}"が反応してくれません。なぜでしょうか。ちなみに手入力した際は問題なく計算してくれます。

/*  現在日時入力ボタン   */
(() => {
  'use strict';
  kintone.events.on(['app.record.create.show', 'app.record.edit.show'], (e) => {
  
    // 追加ボタンを設置
    const FSpace = kintone.app.record.getSpaceElement('FSpace');
    const FButton = document.createElement('button');
    FButton.innerHTML = '終了';
    FButton.onclick = addFTime;
    FSpace.appendChild(FButton); 

  });

  // 終了時間を追加するする関数
  const addFTime = () => {
    const record = kintone.app.record.get().record;
    const nowTime = luxon.DateTime.local();
    const HHmm = nowTime.toFormat('HH:mm')
    record.F.value = HHmm;

    kintone.app.record.set({record: record});
  }

})();



/* 工数計算 */
(() => {
  'use strict';

  kintone.events.on([
    'app.record.create.change.F',
    'app.record.edit.change.F'
  ], (event) => {
    // 休憩開始時間を定義
    const TimeSche = [736];
    const record = event.record;
    // 作業開始と終了時間を分に変換
    const Shm = record.S.value.split(':');
    const Fhm = record.F.value.split(':');
    const Sm = Number(Shm[0]) * 60 + Number(Shm[1]);
    const Fm = Number(Fhm[0]) * 60 + Number(Fhm[1]);

    let TotalTime = Fm - Sm;

    // 作業開始と終了時間と休憩時間を昇順で並び替え
    TimeSche.push(Sm);
    TimeSche.push(Fm);
    TimeSche.sort((a,b) => a - b);

    // 開始と終了の間にある休憩があれば減算
    if (TimeSche[1] == 736) {
      TotalTime -= 45;
    }

    record.工数.value = TotalTime;

    return event;
  });
})();

[pomo]

changeイベントの下記リンク下に書いてあるようにタイミングがフォーカスが外れたとき等なので、フォーカスを外す処理を付与してあげると動作するかもですね。

もしくはチェンジイベント用に書いたコードを関数としてまとめて、
ボタン実行時の終わりとチェンジイベントそれぞれで実行してあげるようにしてあげるのもいいかもしれませんね。

レコード追加画面でフィールドの値を変更したときのイベント

[futamu]

pomo様

ご返信ありがとうございます。
イベントのタイミングを理解してなかったです。
ご教授いただきありがとうございます。

フォーカスを外すのがうまくいかなかったので、
ボタン実行時とチェンジイベントそれぞれで実行するように変更しました。
無事動くようになりました。

ありがとうございます。
今後ともよろしくお願いいたします。