お世話になっております。
レコード一覧画面のインライン編集の保存成功後イベントにて、
自画面の再読み込みがうまくいかず困っております。
背景・実現したいこと
①レコード一覧画面でインライン編集し、レコードを保存
②編集内容を他のレコードにも反映
③他レコードの表示が最新ではないため、レコード一覧を更新したい
上記、③でレコード一覧を更新するため、
当初は、レコード一覧画面のインライン編集の保存成功後イベントでlocation.reload()を使用する予定だったのですが、
毎回再読み込みのアラートが表示されるため使用を断念しました。
そこで、event.urlにlocation.hrefで自画面のURLを設定し、自画面の再読み込みを行えばよいと考え処理を実装したのですが、
レコード一覧画面の1ページ目やレコードの絞り込み条件がない場合は再読み込みが行われ、
レコード一覧画面の2ページ目や、レコードの絞り込み条件などがあると、再読み込みが行われませんでした。
(特にエラーなどの発生もなし)
どなたか対応策についてお教えいただけないでしょうか？
よろしくお願いします。
こんにちは！
再読み込みのエラーについてですが、
更新によって内部で持っているレコードのrevisionと、表示上のレコードのrevisionにずれが生じている状態だと思いますが、
どのタイミングでズレが生じているかはわからないため、
コードを貼り付けていただくとアドバイスしやすいかと思います！
↓過去質問ではこんな例があります。詳細画面での事象ですが、ご参考になれば～と思います（＞＜）！
https://developer.cybozu.io/hc/ja/community/posts/900001952026-%E3%83%AC%E3%82%B3%E3%83%BC%E3%83%89%E8%A9%B3%E7%B4%B0%E7%94%BB%E9%9D%A2%E3%81%A7PUT-%E3%83%AA%E3%83%AD%E3%83%BC%E3%83%89%E6%99%82%E3%81%AE%E3%82%A8%E3%83%A9%E3%83%BC
juridon様
回答ありがとうございます。
本件、レコードの更新はできているのですが、特定の条件下で画面のリロードができない事象が発生しており、
お教えいただいた事例とは少しニュアンスが異なるようでしたので、念のため補足させていただきます。
以下、ソースになります。
レコード一覧画面インライン編集時の保存完了後イベントにて、
他レコードのフィールドを更新し、画面をリロードしたいと考えておりますが、
レコードのソート順などを指定していると画面のリロードが効かず、困っております。
(function ($) {
"use strict";
kintone.events.on(["app.record.index.edit.submit.success"], (e) => {
let recordId = e.record.$id.value;
let params = {
"app": kintone.app.getId(),
"query": `$id != ${recordId}`
};
return kintone.api(kintone.api.url("/k/v1/records", true), "GET", params).then((resp) => {
// 該当データなし
if (resp.records.length < 1) {
return e;
}
// 更新用レコード作成
let putRecords = [];
resp.records.forEach((record) => {
putRecords.push({
id: record.$id.value,
record: {
備考: {
value: e.record.備考.value
}
}
});
});
// レコード更新
params = {
"app": kintone.app.getId(),
"records": putRecords
};
return kintone.api(kintone.api.url('/k/v1/records', true), "PUT", params);
}).then((resp2) => {
// 画面リロード
e.url = location.href;
return e;
}).catch((err) => {
console.log(err.message);
return e;
});
});
})(jQuery);
コードありがとうございます！
なるほどです。
保存後ですが、一覧画面の編集中状態で画面遷移しようとするので「再読み込みしますか」のダイアログが出てくる状態ですね！
リロードのところで、setTimeout を使うのはいかがでしょうか？
○ミリ秒後に実行するようにできるので、編集画面が終わった後にリロードを走らせることができると思います。
500ミリ秒後とかにリロードをすれば「再読み込みしますか」ダイアログ出てこなくなると思います。
※○秒という指定が"さじ加減"になってしまうので、あんまりおすすめされない方法ではありますが、苦し紛れに使う場合もあります（＞＜）
↓外部サイトですがsetTimeoutの使い方です。
https://techacademy.jp/magazine/5541
juridon様
回答ありがとうございます。
画面リロード時にlocation.reload()を使用した場合は、
juridon様の仰る通り、「再読み込みしますか」のダイアログが出てくる状態です。
ご提案の通り、setTimeoutを使用したいと思います。
ご丁寧な対応ありがとうございました。
余談ではありますが、私が記載したコード(e.url = location.href)の場合は、
「再読み込みしますか」のダイアログ表示などもされず、
そもそも処理が走っていないように見受けられました。
// 画面リロード
e.url = location.href;
returne;
⇒レコード一覧の1ページ目や絞り込み条件などがない場合は画面がリロードされる。
ソート順を変更したり、絞り込み条件を指定すると動作しない。
絞り込み条件やソート順などの指定がある場合、自画面には画面遷移しないようにしている？
こんにちは！
e.url = location.href;
動きそうですけど、動かないのですね
どうして動かなくなるんでしょうね
juridon様
コメントありがとうございます。
私の方も動く場合、動かない場合があって困惑しています・・・。
色々と調査してみた結果、e.url = location.hrefが効かない条件は下記みたいです。
①遷移元、遷移先が自画面であること
②クエリ指定があること
レコードの絞り込みや昇順・降順指定、ページ指定など、何かしらの条件があると効かない。
(遷移先が自画面の場合、レコードの表示条件を保持したいために何かしている？)
皆様の参考になれば幸いです。
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。