同一名(name=)のform部品があるときにjavascriptで入力チェックをする
formの必須項目のチェックをjavascriptで行うとき、例えば
(javascript側) function Check() { if(document.form1.name.value == ""){ // このhtml文章内のform1のname部品の値が空白ならば警告メッセージ alert("お名前を入力してください"); return false; } return true; } (html側) <form method="post" name="form1" onSubmit="return Check()"> お名前<br /> <input name="name" type="text" size="30"> </form>
こんな風に書くのだろうが、この方法だとチェックボックスのように同じ名前(name=)のものが複数あると困る。
(というか困ったんです。私。)
試行錯誤の末わかったが、同一部品名のものがあると、配列になる。
そこで、例えば、チェックボックスを二つ以上選ばなければ警告!としたい場合は
(javascript側) function Check() { n = document.form1.checkbox1.length; // このhtml文章内のform1のcheckbox1部品の数がnに入る // (document.form1.checkbox1がcheckbox1部品の配列になっている) count = 0; for(var i = 0;i < n;i++){ if (document.form1.checkbox1[i].checked){ count++ // チェックされていればカウントアップ } } if(count < 2){ alert("2つ以上選んでください"); return false; } return true; } (html側) <form method="post" name="form1" onSubmit="return Check()"> <input name="checkbox1" type="checkbox" value="A"> A<br/> <input name="checkbox1" type="checkbox" value="B"> B<br/> <input name="checkbox1" type="checkbox" value="C"> C<br/> <input name="checkbox1" type="checkbox" value="D"> D<br/>
こんな風に書けばいい。これが一番シンプルかどうかは判りませんが。
いつかだれかの役に立てば。