【フォームブリッジ】確認画面から不要な項目を消したい

 お世話になっております。

フォームブリッジについての質問です。

 

確認用に同じ内容をもう一度入力するフィールドを使用しているのですが、確認画面に同じ内容を二つ表示しておきたくないため、確認画面では確認用のフィールドは表示しない仕様にしたいと考えています。

条件分岐で消すための隠しチェックボックスを作りfb.events.confirm.submit イベントで消す形を試してみたのですが、一度確認画面に進んでから入力画面に戻った際にも消えたままになってしまうため実現できませんでした。

上記の仕様を実装する方法はありますでしょうか?ご教示いただけると幸いです。

nakaさん

 

フィールドを消すのではなく、非表示にするだけでいいのかと思います。

fb.events.form.created イベントで fields[0].style.display = ‘inherit’

fb.events.form.confirm イベントで fields[0].style.display = ‘none’

とするのはどうでしょう?

落合さん

 

ご返答ありがとうございます。

ご教示頂いた方法によって、戻るボタンでフォームに戻った時の挙動は希望通り実装できました。

しかし、エラーでフォームに戻った際は消えたままになってしまいました。

確認フォームを必須項目にしているため、空欄のまま非表示になってしまうと行き詰る状態です。

 

エラー時にはもう一度可視状態にする、または確認画面に完全に移行してから非表示にする方法はありますでしょうか?

よろしくお願いいたします。

nakaさん

fb.events.form.confirm イベントではなく fb.events.confirm.created イベントを使うとどうでしょう?


    (function () {
    'use strict';
    
    fb.events.form.created = [function (state) {
    state.fields[0].style.display = 'inline-block';
    return state;
    }];
    fb.events.confirm.created = [function (state) {
    state.fields[0].style.display = 'none';
    return state;
    }];
    })();

落合さん

 

ご回答ありがとうございます。

ご教示頂いた方法で期待通りの動きを実装することができました。

この度は丁寧なご回答まことにありがとうございました。

落合さん

 

申し訳ございません。

改めて確認したところ、fb.events.confirm.createdイベントでは項目が確認画面から消えずに残ってしまっていました。

他にエラー時は可視状態、確認画面では不可視にできる実装方法はありますでしょうか?

 

nakaさん

 

やりたいことは、「確認画面で特定のフィールドを表示しない」でよかったでしょうか?

手元では先程のコードで、MacのChrome, FF, Safariで想定通りに動いています。

ブラウザによる差分は起こりそうにない処理ですが、一応ブラウザは何になりますでしょうか?

落合さん

 

もう一度確認したところ、自分が記述したコードの方に誤りがありました。

それらを修正したところ、こちらで使用している全ての環境で正しく動くようになりました。

お手数おかけしてしまい申し訳ございません。

この度は丁寧なご返答ありがとうございました。

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