Q&A
回答のコメント欄にて書き込まれている「データがチェックされた状態」についての詳細な説明を求めます。display:noneの場合にデータがチェックされるか否かの情報を求めているようですが、その「チェック」そのものが何なのか、質問からもコメントからも読み取れません。
入力項目を隠すために、CSS で、display:none にして見えないようにとりあえずしようかなと思っています。その隠された入力項目のデータが送られることが偶然あるのでしょうか？ ブラウザのdevelopper tool を使えば簡単にできるのですが、偶然そういったことが起こる可能性があったら、教えてください。
なんらかの理由で、dsiplay:none が機能しなくなったりとか、ありそうな気がします。
簡易的に、データ入力制限をするための策なので、究極的には、データのバリデーションを行えばよいとは思っています。
厳密な環境は特に提示しないでの質問ですみません。回答は、実際に体験して、ぱっと思いつくことがある方や、ネット上で
そういったことがあるという情報を知っている方でいいのでお願いします。
フォームの一部にあるラジオボタンを、display:none にします。これでその部分は、見えなくなるので、通常ならチェックはできません。何らかの状況で、偶発的に（意図的でなく、display:none が外れている場合とか。）にチェックできてしまう状況です。
回答4件
0
ベストアンサー
display: none; してもフォーム送信されますが、該当要素に disabled 属性を付与する事でフォーム送信しなくなります。
HTML
1<form> 2 <input type="text" name="hoge"> 3 <input type="text" name="foo" disabled><!-- フォーム送信されない --> 4</form> 5 6<script> 7document.querySelector('form').elements['hoge'].disabled = true; // input[name=hoge] を disabled にする 8</script>
簡易的に、データ入力制限をするための策なので、究極的には、データのバリデーションを行えばよいとは思っています。
フォーム送信制限をかけたとしてもフォーム送信することは可能なのでサーバ側でのバリデーションは必須だと思って下さい。
CSS や JavaScript で制限をかけたとしても突破する方法はいくらでもあります。
(9/16 12:58追記)
ひょっとして、こういう事なんでしょうか。
× Q. <input type="checkbox" style="display: none;" checked> でフォーム送信される事が偶発的にありえますか？
↓
○ Q. <input type="checkbox" style="display: none;"> となっているコントロールをユーザが checked 状態にする事は可能ですか？
私は前者だと思っていましたが、後者の場合はいくつか方法があります。
- ブラウザの CSS を Off にしている
- CSSを使わないテキストブラウザを使用している
- 外部CSSの読み込みに失敗した
- JavaScript で
input.cheked = true;を実行する(bookmarkletやコンソール等)
基本的に CSS に依存する UI は好ましくないと思います。
投稿2015/09/15 10:21
編集2015/09/16 04:00
総合スコア18194
すみません。質問の趣旨は、データがチェックされた状態で送信されることが偶発的にありえるのかということなんです。ＣＳＳで簡易制限をどうやってかけるのがいいかという質問ではないです。
ですから、「display: none; してもフォーム送信されます」と回答したのですが、伝わりづらかったでしょうか。
偶発的ではなく、必然的にフォーム送信されます。
疑わしければ、検証してみてください。
Lhankor_Mhyさんの回答を見て質問文を勘違いしていた可能性に気が付いたので親コメントに追記しました。
はい、そうです。わかりにくくてすみません。
ＣＳＳ依存ＵＩが好ましくないのは、承知した上での質問です。
0
偶発的にではなく、通常送信されます。
下記のようなHTMLで、submitボタンを押下してみてください。
<html> <head></head> <body> <form name="f" method="get"> <input type="submit"/> <input type="text" name="noname" value="見えない入力フォーム" style="display:none;"/> </form> </body> </html>
アドレス欄に、noname=～というリクエストパラメータが付与されてますよね。
つまり、データを送信しているのです。
これを、送信しないようにするには、name属性をとっちゃう事ですね。
<html> <head></head> <body> <form name="f" method="get"> <input type="submit"/> <input type="text" value="見えない入力フォーム" style="display:none;"/> </form> </body> </html>
同様にsubmitボタンを押下してみてください。
リクエストパラメータが無いことがお分かりいただけるかと思います。
投稿2015/09/15 10:02
総合スコア1124
0
入力項目を隠すために、CSS で、display:none にして見えないようにとりあえずしようかなと思っています。その隠された入力項目のデータが送られることが偶然あるのでしょうか？
display:none; で隠しても、表示上消しているだけで、その中に記述しているもの自体はそのままです。
submitされます。
みなさんがおっしゃっているのはココ↑だと思います。
zanjibarさんが聞きたいのは、
"入力項目を隠しているにも関わらず、ユーザーが入力項目を編集できてしまう事象はないか？"
ということですよね？
CSSに限らず、外部からのJavascriptによる書き換えもできるかと思います。
ブラウザのアドレスバーにJavaScriptを入力して実行する
クライアント側では穴はいくらでもあると思うので、
DBへの登録・更新など、データの整合性を保たなくてはならないのであれば、
サーバー側でもデータチェックしたほうがよいと思います。
投稿2015/09/16 05:14
総合スコア1844
0
HTMLの読み込みに成功し、何らかの原因でCSSファイルの読み込みに失敗すれば、CSSのないレンダリングがされ、そのinput要素が表示されているためユーザーによってチェックされることはありえるのではないかと思います。
また、ブラウザのバージョンやIEの互換表示によって表示されることもありえるのではないでしょうか。
IEではなくFirefoxのみで発生するCSS styleトラブル
個人的には普通にtype属性をhiddenにしておいた方が無難ではないかな、と思うのですが……
どうしてもCSSでコントロールしたいなら、念のためreadonly属性を設定しておくとか。
投稿2015/09/16 03:01
総合スコア37460
あなたの回答
tips
プレビュー
