別々のウィンドウで Purge、削除をした場合の挙動について教えて下さい

シンプルな解決方法は Purge 後に location.reload(); することだと思います。
2021年10月21日
ユーザー
  1. ウィンドウ 1 でチェックして完了済にする
     → DB 上で該当する todo のレコードの is_done を true にする

  2. ウィンドウ 2 で Purge する
     → DB 上で is_done が true のレコードを抽出して削除する

ウィンドウ 2 で未完了表示の todo も DB 上ではウィンドウ 1 の操作で完了済になっているため、結果として、ウィンドウ 2 の Purge 操作で、ウィンドウ 2 上では未完了の表示の todo まで DB から削除してしまいます。

画面の表示上では JavaScript で画面上でチェックが付いている todo を DOM 操作で削除するため、見た目ではウィンドウ 2 で未完了表示である todo は残ります。
しかしウィンドウ 2 の画面をリロードすると、DB では削除済みのため、あったはずの todo がリロードで消えたように見えます。
これはかなり問題が大きいのではないかと感じました。

逆の場合(ウィンドウ 1 でチェックを外して未完了にする)は、ウィンドウ 2 で Purge しても DB 上は未完了のため該当の todo は削除されず、ウィンドウ 2 の画面上ではいったんは削除されたように見えるが、リロードするとチェックが外れた状態で復活するという状態になります。
これはこれで問題はありますが、DB から削除されたわけではないので、比較すると問題は小さいかなと感じます。

この問題を解決する方法をご教授ください。

自分で処理の流れを考えた限りでは、

  1. フロント側の JavaScript で fetch の時に checkbox が checked である id の一覧を送る
  2. サーバ側の PHP で DB から is_done が true の id の一覧を作る
  3. 両者を照らし合わせて一致する id の一覧を作る
  4. 3 の id のレコードを DB から削除する
    という感じでいけそうかな?と思いましたが、不一致の分をどう処理すれば使い勝手が良くなるのかが思いつきません。

よろしくお願いします。

この回答を見るにはプレミアムプランへの登録が必要です

プレミアムプランとは?

このレッスンの質問と回答(1)