こんにちわ。
チェックボックスがチェックされているかのチェックを行いたいのですが、チェックボックスをデータベースにある内容をループで表示させ、チェックされたデータをPOSTで送信するために少々submitの使い方が違います。
削除ボタンを押すと確認画面がでてOKを押した場合にチェックボックスにチェックされていなければ警告画面を出したいのですが、どうもうまくいきません。
よい方法をご教授ねがえないでしょうか。
==FORM=======================================
<form method ="POST" name="form1" onSubmit="return check()" action ="****" >
<%
Iterator it =sagyoubi.iterator();
// 検索された行数分ループ
while(it.hasNext()){
String item= (String)it.next();
%>
<INPUT TYPE="CHECKBOX" NAME="sagyoubii" VALUE="<%= item %>"><a href="****" target="Main">
<%
} // end while
%>
<INPUT TYPE="button" VALUE="削除" style="font-size:18" onclick="if(confirm('これらのデータを削除してもよろしいですか?')) { submit(); }">
</form>
==SCRIPT=================================
<SCRIPT TYPE="text/javascript">
<!--
function check(){
var flag = 1;
if(document.form1.sagyoubii.checked){
flag = 0;
}
if(flag){
window.alert('チェックされていません');
return false; // 送信を中止
}
else{
return true; // 送信を実行
}
}
//-->
</SCRIPT>
No.1
- 回答日時:
チェックボックスは複数ある可能性があるので、
document.form1.sagyoubii[x].checked
上記のような配列としての扱いになると思います。
どのようなチェック状態ならOKなのか良く解らなかったのですが、すべての項目がチェックされているかを調べるなら以下のような感じでどうでしょう。
function check(){
var count = document.form1.sagyoubii.length;
if(count == 0){
alert('項目がありません。');
}
for(i = 0; i < count; ++i){
if(document.form1.sagyoubii[i].checked){
alert('チェックされていな項目があります。');
return false;
}
}
return true;
}
一つでもチェックされてれば良いのなら以下のサンプルです。
function check(){
var count = document.form1.sagyoubii.length;
if(count == 0){
alert('項目がありません。');
}
var flag = 0;
for(i = 0; i < count; ++i){
if(document.form1.sagyoubii[i].checked){
flag = 1;
break;
}
}
if(flag){
return true;
}else{
alert('一つもチェックされていません。');
return false;
}
}
この回答への補足
すみません。TYPEをsubmitはできました。
そして、Buttonをやめて下記のようにしたら無事にできました。
<INPUT TYPE="submit" VALUE="削除">
<SCRIPT TYPE="text/javascript">
<!--
function check(){
var count = document.form1.sagyoubii.length;
if(count == 0){
alert('項目がありません。');
}
var flag = 0;
for(i = 0; i < count; ++i){
if(document.form1.sagyoubii[i].checked){
flag = 1;
break;
}
}
if(flag){
confirm('これらのデータを削除してもよろしいですか?')
return true;
}else{
alert('一つもチェックされていません。');
return false;
}
}
//-->
</SCRIPT>
でも、
<INPUT TYPE="button" VALUE="削除" onclick="if(confirm('データを削除します?')) { submit(); }">
で同様の処理ができないのか疑問な今日この頃。
お返事ありがとうございます。
どのような状態がOKなのかを記入せず申し訳ないです。
ざっくり言うと
・チェックボックスは複数ある場合もある。
・1つでもチェックボックスがあればOK
・削除ボタンを押すと確認画面がでる
→確認画面でOKを押した場合、1つでもチェックされていれば画面の遷移
→確認画面でOKを押した場合、1つもチェックされていなければ、警告画面がでる。
といった感じです。
ご教授いただいたサンプルで試したのですが、
チェックが無い状態で削除ボタンを押し、確認画面でOKを押すと、画面遷移を行ってしまいます。(遷移を行っても当然画面を作っていないのでエラーになります。)
どうやら
<INPUT TYPE="button" VALUE="削除" onclick="if(confirm('データを削除します?')) { submit(); }">
でSCRIPTのcheck()を行っていないように思われます。
ちなみにTYPEをsubmitでも試したのですが、1つもチェックが無い状態ではチェックの警告画面がでるのですが、1つ以上チェックしても警告画面が出てしまいます。
No.2ベストアンサー
- 回答日時:
#1です。
仕様が解りましたので、あなたのサンプルをtype="button"で動くようにしてみました。(#1の回答は的がずれてました。すみません。)
<SCRIPT language="javascript" type="text/javascript">
<!--
function check(){
var count = (document.form1.sagyoubii)? document.form1.sagyoubii.length: 0;
if(count == 0){
alert('項目がありません。');
return false;//この行を追加
}
var flag = 0;
for(i = 0; i < count; ++i){
if(document.form1.sagyoubii[i].checked){
flag = 1;
break;
}
}
if(flag){
return confirm('これらのデータを削除してもよろしいですか?');//OKを押されればtrue、キャンセルならfalseを返す
}else{
alert('一つもチェックされていません。');
return false;
}
}
//-->
</SCRIPT>
<FORM method ="POST" name="form1" action ="">
<INPUT type="button" value="削除" onClick="if(check()){submit()}">
</FORM>
<INPUT type="button">のonClickイベントでcheck()を呼び出すと大丈夫だと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
return trueとreturn falseの用...
-
Tabキーでのカーソルの移動...
-
チェックボックスの有無判定
-
プルダウンメニューを選択して...
-
ドロップダウンリストボックス...
-
slickのレスポンシブ > center...
-
テキストボックスに数字しか入...
-
正規表現で複数マッチ条件で悩...
-
ラジオボタンのNullチェック
-
半角英数字のみの入力にエラー...
-
COBOLの数字チェック
-
IE8におけるショートカットキー...
-
フォームの入力チェックをする...
-
未入力のラジオボタンに、alert...
-
プルダウン 項目が多いので先頭...
-
submitボタン押下時にPOSTされ...
-
onchangeイベントを強制的に発...
-
大文字か小文字かを判断する方法
-
【jQuery】input nameの文字列...
-
Selectボックスの幅を自動で広...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
return trueとreturn falseの用...
-
正規表現で複数マッチ条件で悩...
-
JavaScriptde途中で、「exit」...
-
slickのレスポンシブ > center...
-
COBOLの数字チェック
-
チェックボックスの有無判定
-
フォームの入力チェックをする...
-
Visual Studioのデザインでの非...
-
Tabキーでのカーソルの移動...
-
ツリービューのチェックボック...
-
ドロップダウンリストボックス...
-
コピペを禁止するtextarea
-
ラジオボタンのNullチェック
-
未入力のラジオボタンに、alert...
-
form の onSubmit がコールされ...
-
分岐数といえば
-
JSのみで入力→確認→メールで送...
-
JavaScript ログアウト処理
-
TEXTAREAに入力した改行コード...
-
リロードしないようにするには
おすすめ情報