大変お世話になります。
素人質問で大変恐縮なのですが、お力をお借りできますでしょうか。
フォームブリッジでフォームへの回答時・及び確認画面表示時に、ブラウザの「戻る」ボタンを無効化したいと考えています。
背景といたしましては、回答者様にkviewerのマイページから連携させたフォームでご回答いただいた後、確認画面を表示すると同時にjavascriptでポップアップを表示し「回答は一回のみです」と表示させましたところ、複数名の方がご自身の回答内容を確認するためにブラウザの「戻る」で戻ってしまい、kintoneにうまく値の紐づけが出来ず、エラーとしてあがってきてしまうというケースが起きたためです。
それを防ぐためにも、ブラウザの「戻る」ボタンを無効化したいのですが…FormBridge内カスタマイズで解決できるものでしょうか？
色々なサイトを見まして出来る限り試してみたのですが…どうにもうまくいかず。
試してみたコードとしましては、
(function() {
"use strict";
fb.events.form.created = [function() {
history.pushState(null, null, null)
window.addEventListener('popstate', function(){
history.pushState(null, null, null);
})
})];
})();
です。
どうかどちら様かご教示いただけましたら幸いです。
何卒よろしくお願いいたします。
HTRK_FCさん
こんにちは。
JavaScriptでも可能ですが、CSSの方が簡単ですので、そちらをご案内します。
方法はいくつかありますが、2つご案内します。不要な方は、行ごと削除してください。
①表示を消す
②表示するが押せない
.fb-back {
display: none !important; /* 表示を消す */
pointer-events: none !important; /* 表示するが押せない */
}
HTRK_FCさん
勘違いしていました。
フォームブリッジ標準の戻るボタンではなく。「ブラウザの戻る」ですね。
こちらは方法が異なりますので、上記無視してください。
HTRK_FCさん
連投失礼します。
ブラウザの戻るの場合は、他イベント内に記述してみていかがでしょう。
確認画面上でしたら、以下の通り「fb.events.confirm.mounted 」に記述。
fb.events.confirm.mounted = [function(state) {
history.pushState(null, null, null);
window.addEventListener('popstate', function(e) {
history.pushState(null, null, null);
return;
});
}];
koichi さん
まずは、ご回答誠にありがとうございました！
ご指導の通りで試してみたのですが、どうにもうまく反応せず…。
「DOMが作成された時」「確認画面に戻る前」「フィールドの値が変わった時」など、色々な条件で試してみたのですが、ブラウザの戻るボタンは依然として機能しているようでございました…。
(function() {
"use strict";
fb.events.confirm.mounted = [function(state) {
history.pushState(null, null, null);
window.addEventListener('popstate', function(e) {
history.pushState(null, null, null);
return;
});
}];
この「fb.events.confirm.mounted」の部分を色々書き換えてみたり、既に適用しているスクリプトの下にくっつけてみたりもしたのですが、いずれも反応せず…。
せっかくご回答いただきましたのに、申し訳ございません。
ですが改めまして、ありがとうございました！
HTRK_FCさん
ご確認いただきありがとうございます。
お使いの環境にもよるのかもしれません。
ご参考までにWindows10のChrome(98.0.4758.82)では機能しております。
お力になれずすみません。
koichi さん
とんでもないことでございます！
ご回答いただけただけで救われた気分になりました。
同じフォームブリッジでも、kviewerからマイページを経てフォームにさえ移動しなければ、ブラウザの戻るボタンは最初から機能しないようなのですが、経由すると、どうにもこちらの環境（Microsoft Edge 98.0.1108.43 (64 ビット)）では"戻れる"状態になり、javascriptもうまく動作してくれないようです。。。
ともあれ、お手を差し伸べていただいたことに感謝いたします。本当にありがとうございました。
HTRK_FCさん
解決に至らずですが、その後確認できたことだけ最後に記載しておきます。
フォームブリッジに画面遷移した後、画面上のどこもクリックしないままですと、戻ることができてしまいます。
どこかしらクリックされる（フォーカスされる）と、戻るが無効になります。
ChromeでもEdgeでも確認できたものです。
どうやらブラウザの仕様らしい、ということが調べたら書かれていました。
focus()やclick()を使い、強制的にどこかの要素にフォーカスを当てようともしたのですが駄目でした。
koichi さん
貴重なリプライありがとうございます＾＾
こちらの環境でも試してみました。
が…結果は、EdgeでもChromeでもダメでした。。。
マイページからフォームブリッジへ画面遷移してすぐ「戻る」を禁止したかったので、
「fb.events.form.mounted」イベントを使用して、あとはそのままコピーで使わせていただいたのですが…。
他のスクリプトが邪魔をしてしまってるのか、私どもの使っているパソコンが相性が悪いのか…。
度々ご尽力いただいているにも関わらず、ご期待に沿うお返事が出来ず申し訳ありません。
ですが重ねて、ここまでお付き合いをいただいておりますことに感謝申し上げます。＾＾
system
(system)
クローズされました:
10
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。