新規投稿
フォローする

ステップフォーム使用時の完了画面から戻る場合

ステップフォームを使用しておりまして、完了画面まで行った後、戻るボタンを押したときに、一個前のステップに移動することは可能でしょうか。現状は最初まで戻ってしまい、かつ、Javascriptで必須のリセットしていたものも選択が消えてしまいます。どうにかなりますでしょうか。

0

6件のコメント

Avatar
友利優希

林田大平様

お世話になっています。

cstapの友利と申します。

完了画面というのは確認画面のことでよろしいでしょうか?

その場合は以下のJavaScriptで確認画面から戻った時に最後のステップを表示することができます。

(function() {
"use strict";

let confirm = false;

fb.events.form.mounted.push(function (state) {
if (!confirm) return;
let count = state.form.stepSize-1
while (count) {
document.querySelector('.fb-next').click();
count--;
};
})

fb.events.confirm.mounted.push(function (state) {
confirm = true;
})

})();

又、'Javascriptで必須のリセットしていたものも選択が消えてしまう'

ということについて、もう少し詳しくお聞きしてもよろしいでしょうか?

1
Avatar
1031

cstap 友利様

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

ご連絡ありがとうございます。

こちら試してみます。

ちなみに、リセットは下記のようなJavascriptを入れています。

(function() {
"use strict";
fb.events.form.created = [function (state) {
state.record.radio_0.value = "";
state.record.drop_0.value = "";
return state;
}];
})();

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

0
Avatar
1031

cstap 友利様

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

試してみましたが、できました。ありがとうございました。

ただ、3ページのステップフォーム構成で、2ページ目で必須項目の条件分岐があり、3ページ目でそれを表示するかしないかを設定しております。

なので、上記の設定により、2ページ目の必須項目がリセットされているようなので、結局もう1ページ前に戻る必要がありそうです。

1031により編集されました
0
Avatar
友利優希

林田大平様

次のコードを読み込むことで想定の挙動をするかと思います。

(function() {
"use strict";

let confirm = false;

fb.events.form.mounted.push(function (state) {
if (!confirm) return;
let count = state.form.stepSize-1
while (count) {
document.querySelector('.fb-next').click();
count--;
};
})

fb.events.confirm.mounted.push(function (state) {
confirm = true;
})

fb.events.form.created.push(function (state) {
if (confirm) return;
state.record.radio_0.value = "";
state.record.drop_0.value = "";
return state;
});

})();

こちらのコードでリセットの役割も果たしているので、こちらだけ読み込んでください

1
Avatar
1031

cstap 友利様

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

ご連絡ありがとうございます。

試してみます。

0
Avatar
1031

cstap 友利様

できました。ありがとうございました。

0
サインインしてコメントを残してください。