背景
業務で以下のチェックボックスを削除する依頼が入りました。
ビジネス要件の為、現時点では抽象的な表現になっています
後続で具体的な対応について説明します
前提）
このチェックボックスはformで送信され、DBが更新されます。
チェックボックスの初期値はDBに登録されているデータです。
開発はABテストのような進め方をしていましたので、特定の条件下ではこのチェックボックスを表示させる必要があります。
結論）フロントエンドの修正のみに留めることになりました。
上司から以下の助言を頂いたので次の章で具体的な実現方法の検討に入ります。
「チェックボックスの初期値にはDBで登録されている値が設定されているので、特定の条件で非表示にさせるだけで良い」
以下は当初考えていた対応なので読まなくても大丈夫です。
没案）
formに隠し要素を用意する
<input type="hidden" name="sample-hidden"/>
Controller側でリクエストのペイロードにこのkey（sample-hidden）があるか判定する
- チェックボックスを表示させる必要がある場合
チェックボックスの値を送信します - チェックボックスを削除する必要がある場合
チェックボックスの値を送信せず、DBに登録されている既存の値を取得して送信し直す
上司から指摘された問題点）
今回、Controller側で修正を加えるとデグレのリスクが大きいということ
そこでフロントエンドの対応に留める方針を考え直しました。
要素を非表示にするが値を送信したい
display:none
これだと要素は非表示になりますが、存在しない要素として扱われるのでform送信の対象にならないです。
よって不採用です。
visivility:hidden
要素を非表示にしますがレイアウトからは削除されません。つまりform送信の対象になります。
ですが、要素が持つスペース自体はなくならないので不採用です。
隠し要素をtype=checkboxからtype=hiddenに変える
<input type="hidden" name="sample" value="{{$model && $model -> key ? 1 : 0 }}" />
このようにすると、要素のスペースが完全になくなりますが、formの送信対象になります。
よってこちらを採用することになりました。
最後に
ビジネスの要件、デグレリスクも踏まえて的確な実装ができるようになりたいです。
こうした基礎的な知識を業務から遅延学習しキャッチアップします。
参考