nameにドットが付いているチェックボックス

[新着] Webテンプレートを仮オープンしました



0   名前: nwa : 2007/09/19(水) 12:54  ID:ZfVaSVpi sub-t1
チェックボックスの全チェックのjavascriptを作っていて
あるサンプルを真似て作成したのですが、
name="test.r1"のようにチェックボックスの名前に.が含まれてしまう場合に
チェックが付きません。
どなたか知っていましたら教えていただけないでしょうか?
よろしくお願いします。

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
<SCRIPT TYPE="text/javascript">
<!--
var count;
function BoxChecked(check){
for(count = 0; count < document.form1.r1.length; count++){
document.form1.test.r1[count].checked = check;
}
}
//-->
</SCRIPT>
</HEAD>
<BODY>


<FORM NAME="form1">
<INPUT TYPE="button" onClick="BoxChecked(true);" VALUE="全て選択">
<INPUT TYPE="button" onClick="BoxChecked(false);" VALUE="全て未選択"><BR><BR>
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="1"> 項目(1)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="2"> 項目(2)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="3"> 項目(3)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="4"> 項目(4)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="5"> 項目(5)<BR>
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="6"> 項目(6)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="7"> 項目(7)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="8"> 項目(8)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="9"> 項目(9)
<INPUT TYPE="checkbox" NAME="test.r1" VALUE="10"> 項目(10)<BR>
</FORM>


</BODY>
</HTML>

1   名前: 匿名 : 2007/09/19(水) 12:54  ID:NPBwAyTY sub-Ds
何にでもルールというものがあるからね。
自分勝手にどんな名前をつけても良い訳ではない。
ピリオドの代わりにアンダースコアじゃだめなの?

2   名前: nwa : 2007/09/19(水) 12:54  ID:ZfVaSVpi sub-t1
javaのstrutsのtaglibから生成されたHTMLなので
意識してnameを付けられないのです^^;

下記のようなコードから生成(展開)されたと考えていただければ…

<logic:iterater name="test" 〜>
<html:checkbox name="test" property="r1" />
</iterator>

3   名前: 匿名 : 2007/09/19(水) 12:54  ID:5fOzsGtx sub-Cz
だから、省略形なんて使うなと俺は何度も何度も言ってる。
document.forms['form1'].elements['test.r1'][count].checked
# これも一種の省略形であることには、今は触れない。

もっと言えば、form 要素に name 属性なんぞ付ける必要すらない。
function BoxChecked(form, check){
    ....
    form.elements['test.r1'];
}

onclick="BoxChecked([/var]this.form[/var], true);"
JavaScript 1.0 の頃からあるのに、なんでこういう「相対的な」書き方は流行らないのだろう?

4   名前: 匿名 : 2007/09/19(水) 12:54  ID:5fOzsGtx sub-Cz
>>3
あータグ失敗。失礼。
onclick="BoxChecked(this.form, true);"



ついでに補足。DOM-HTML での書式は
document.forms.namedItem('form1').elements.namedItem('test.r1')

ただし、ECMAScript 上では
document.forms['form1'].elements['test.r1']

という書き方も許されている。

DOM-HTML の定義上、elements.namedItem() の戻り値は Node だが、HTML5 は現実の実装に合わせ、同じ name 属性を持つコントロールを NodeList として返すように定めた。
document.forms.namedItem('form1').elements.namedItem('test.r1').item(0).checked;

// ECMAScript Language Binding
document.forms['form1'].elements['test.r1'][0].checked;

さらに、HTML5 は JS 1.0 以来の省略記法(>>0)も再定義しているが、これでタイプ量が減るとか可読性が向上するとかいうことはまずないので、忘れて良い。

そして、全てのフォームコントロールは、自身が属するフォームを示す form プロパティを持っている。これにより、無駄な名付けを避けることができる。だいたい、今どき form 要素の name 属性なんぞ使わないでくれ。どうしても使うなら id 属性を並記すべき。

5   名前: NullPo : 2007/09/19(水) 12:54  ID:Z0FHbpib sub-ii
気になったから少しだけ。

>>1
ピリオドは使ってもいいと書いてあるように見える。
http://www.w3.org/TR/html401/types.html#type-name

一覧へ戻る