htmlでチェックボックスを全選択

解決済

質問者：nama_me
質問日時：2009/04/14 10:35
回答数：3件

現在perl言語とhtml言語を使用しweb上で見れるホームページを作成しています。

perl言語とhtmlを言語を使用して全てのチェックボックスにチェックをいれるボタンを作成したいのですが、
中々上手くいきません。

※以下.cgi内の部分ソース

print <<HTML_BODY;

</table><br>
<input type='submit' value='送信'>
<input type='reset' value='リセット'>
</center>
</form>

</body>
</html>
HTML_BODY

ネットでも調べたのですが、JavaScriptを使用しないとできない？様な事が書かれていました。
私一人では分からないので、皆様ご教授お願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： taloo
回答日時：2009/04/14 13:12

CGIでもできます。

というか、昔は全部（必ず）この方法でした。
CGIではボタンを押すたびにページ全体を読み直し、表示し直さないと行けないので、時間がかかる事があります。
利用者の利便性（表示の待ち時間を減らす）を考えれば、JavaScriptをおすすめしますが、
JavaScriptを使用できない、使用を停止している環境もある事を忘れずに。。。

index.cgi
---------------
#!/usr/bin/perl
use CGI;
my $q=CGI->new;
my $smt=$q->param('smt');
my $checked=$q->param('chk_on')?'checked':'';
my $message=($smt)?'':$q->param('message');

print "Content-Type: text/html\n\n";

print <<_HTML_;
<html>
<body>
<form action="index.cgi" method="post">
<label><input type="checkbox" name="c1" value="1" $checked>check1</label>
<label><input type="checkbox" name="c1" value="2" $checked>check2</label>
<label><input type="checkbox" name="c1" value="3" $checked>check3</label>
<br>
<input type="submit" name="chk_on" value="全てチェックする">
<input type="submit" value="全てはずす">
<hr>
<input type="text" name="message" value="$message_tmp"><br>
<input type="submit" name="smt" value="送信">
</form>
<hr>
_HTML_

if($smt){
$message=$q->param('message');

print <<_HTML_;
<h1>投稿した内容</h1>
<p>$message</p>
_HTML_
} # if($smt)

print <<_HTML_;
</body>
</html>
_HTML_

exit;

未検証です。

- 0
- 件

通報する

この回答へのお礼

ご返答ありがとうございます。

早速試してみたところ、正常に動きました。
これを元に作成していきたいと思います。

通報する

お礼日時：2009/04/15 11:44

No.2

回答者： STICKY2006
回答日時：2009/04/14 11:00

>>JavaScriptを使用しないとできない？様な事が書かれていました。

うん。
多分、JavaScriptを使うのが一番スマートかと。
ユーザーのブラウザ上で動くわけですし。
（Perlの方でも当然、できなかないですけど、わざわざ一回サーバの方で処理する必要も無いでしょうし。

JavaScriptのお勉強をすることをオススメしておきます。

例）これが良いです！とは言いませんが。
http://www.nishishi.com/javascript/2007/checkbox …

- 0
- 件

通報する

この回答へのお礼

ご回答有難うございます。

早速JavaScriptの勉強をします。

通報する

お礼日時：2009/04/14 11:17

No.1

回答者： inu2
回答日時：2009/04/14 10:53

たとえば

「全てをチェックする」
というようなボタンを作って、それをクリックすると表示されているチェックボックス全てをチェック状態にする。
などのような動きを実現したいのであればJavaScriptでなければ不可能です。

HTMLは見た目の構成を作るためのもの。
何かしらの動きを再現はできない。

perlは、サーバー上でプログラムが動くわけですから、ブラウザでの見た目を動的に変えることは出来ません。

ですから、ブラウザ上で動くプログラムが必要になります
それがJavaScriptです。

- 0
- 件

通報する

この回答へのお礼

早速のご回答有難うございます。

あるサイトから以下のを持ってきて貼り付けてみたのですが、何故か全チェックが出来ませんでした。
ご教授お願い致します。

※以下持ってきたソース

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
<TITLE>チェックボックスを全チェック</TITLE>
<SCRIPT TYPE="text/javascript">

var count;
function BoxChecked(check){
for(count = 0; count < document.form1.r1.length; count++){
document.form1.r1[count].checked = check;//チェックボックスをON/OFFにする
}
}

</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="r1" VALUE="1"> 項目(1)
<INPUT TYPE="checkbox" NAME="r1" VALUE="2"> 項目(2)
<INPUT TYPE="checkbox" NAME="r1" VALUE="3"> 項目(3)
<INPUT TYPE="checkbox" NAME="r1" VALUE="4"> 項目(4)
<INPUT TYPE="checkbox" NAME="r1" VALUE="5"> 項目(5)<BR>
<INPUT TYPE="checkbox" NAME="r1" VALUE="6"> 項目(6)
<INPUT TYPE="checkbox" NAME="r1" VALUE="7"> 項目(7)
<INPUT TYPE="checkbox" NAME="r1" VALUE="8"> 項目(8)
<INPUT TYPE="checkbox" NAME="r1" VALUE="9"> 項目(9)
<INPUT TYPE="checkbox" NAME="r1" VALUE="10"> 項目(10)<BR>
</FORM>

</BODY>
</HTML>

HTML_BODY2