- 締切済み
XHTMLのSELECTについて
Java(フレームワークはSeasar)とXHTMLを使用したサイトなのですが、 データベースから取得した値を初期状態でSELECTに選ばせることができません。 DBで取得した値はJavaで public String menuDispFlg; と宣言された変数に格納されています。 デバッグで変数に値が格納されていることは確認できています。 SELECT部分を抜き出したソースが↓です。 <form id="form"> <div class="salesis"> <div class="salesIn"> <div class="main"> <div class="mainIn"> <div class="cF"> <div class="commontbl"> <table cellpadding="0" cellspacing="0"> <tr> ・ ・ ・ (略) ・ ・ ・ <th scope="row"><p>メニュー表示</p></th> <td class="A"> <select id="menuDispFlg" name="menuDispFlg" tabindex="10"> <option value="0" label="制御しない"></option> <option value="1" label="制御する"></option> </select> </td> </tr> </table> </div> </div> </div> </div> </div> </div> </form> DBからmenuDispFlg = "1"を取得しても、一番上の"制御しない"を常に選択した状態になっています。 このSELECTで"制御する"を選択するとちゃんとmenuDispFlg="1"で送信されるのですが、変更する前の値がわからなくなるのでどうにか修正したいです。 よろしくお願いいたします。
- yukinoshitait
- お礼率21% (4/19)
- HTML
- 回答数3
- ありがとう数5
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- teketon
- ベストアンサー率65% (141/215)
JSFを使っているなら、h:selectOneListbox か h:selectManyListboxを使います。
- Picosoft
- ベストアンサー率70% (274/391)
> DBから取得したmenuDispFlgが0のときは"制御しない"を、1のときは”制御する"を選択済みにするよう分岐させたいのです。 Seesarはつついたことがないので具体的なコードは書けませんが、 <option value="0" label="制御しない" (menuDispFlgが0ならselectedを出力)></option> <option value="1" label="制御する" (menuDispFlgが1ならselectedを出力)></option> という風にできませんか？
- Picosoft
- ベストアンサー率70% (274/391)
<option value="value" label="label" selected></option> というように、 選択肢を初期状態で選択済みにするにはselected属性をつけてください。
関連するQ&A
- セレクトボックスでそれ以降の表示を切り替えたい
http://5am.jp/javascript/form_change_javascript/ の「サンプルソース（セレクトボックス）」のような入力フォームを作成中です。セレクトボックスでの選択によって、その下に複数行表示させたいので、サンプルソースのgetElementByIdのところをgetElementsByClassNameにして実装してみたのですが動きませんでした…。 以下が自分が書いたコードになります。どこがおかしいのでしょうか？ （インデントがうまくできていなくて申し訳ないです。） 回答よろしくお願いします。 <script type="text/javascript"> function entryChange2() { if (document.getElementById('changeSelect')) { id = document.getElementById('changeSelect').value; if (id == 'select1') { document.getElementsByClassName('firstBox2').style.display = ""; document.getElementsByClassName('secondBox2').style.display = "none"; } else if (id == 'select2') { document.getElementsByClassName('firstBox2').style.display = "none"; document.getElementsByClassName('secondBox2').style.display = ""; } } } window.onload = requestChange; </script> <form> <table border="0" cellspacing="0" cellpadding="0"> <tr> <th>利用方法</th> <td> <select id="changeSelect" name="hoge" onchange="entryChange2();"> <option value="select1">初めて申し込む</option> <option value="select2">2度目以降の利用</option> </select> </td> </tr> <!-- 表示非表示切り替え --> <tr class="firstBox2"> <th>紹介者</th> <td><input type="text" /> <p>紹介された方のお名前を入力してください。</p></td> </tr> <tr class="firstBox2"> <th>紹介者のメールアドレス</th> <td><input type="text" /> <p>紹介された方のメールアドレスを入力してください。</p></td> </tr> <!-- 表示非表示切り替え --> <tr class="secondBox2"> <th>名前</th> <td><input type="text" /> <p>名前を入力してください。</p></td> </tr> <tr class="secondBox2"> <th>会員番号</th> <td><input type="text" /> <p>会員番号を入力してください。</p></td> </tr> </table> </form>
- ベストアンサー
- JavaScript
- セレクトボックスを使用した、フォームのアクティブ・非アクティブの切り替え
セレクトボックス（A）を使用して、（A）の選択結果により（A）以降をアクティブ・非アクティブに切り替えたいのです。 アクティブ・非アクティブの切り替え自体は正常に動くのですが、一度「送信する」をクリックした後、次の画面に移動し、その後「戻る」をクリックorブラウザの戻るで元のページに戻ると、アクティブ化できていたセレクトボックス（C）が全て非アクティブとなってしまっているのです。 原因は何でしょうか？よろしくお願いいたします。 function setTF() { n = document.mail.Data.selectedIndex; flag = eval(document.mail.Data.options[n].value); document.mail["B"].disabled = flag; document.mail["C"].disabled = flag; } ※以下HTML※ <form action="mail.cgi" method="post" name="mail"> <table> <tr> <th>セレクトボックス（A）</th> <td><select name="Data" onchange="setTF()"> <option value="false">アクティブ</option> <option value="true" selected="selected">非アクティブ</option> </select></td> </tr><tr> <th>テキスト（B）</th> <td><input size="4" type="text" name="B" disabled="disabled" /> 才</td> </tr><tr> <th>セレクトボックス（C）</th> <td><select name="C" disabled="disabled"> <option>選択肢1</option> <option>選択肢2</option> </select></td> </tr><tr> <td colspan="2" class="submit"><input type="submit" value="送信する" /><input type="reset" value="リセット" /></td> </tr> </table> </form>
- ベストアンサー
- JavaScript
- JavaScriptのSELECTの値について
JavaScriptについて、質問させてください。 html1からhtml2にSELECTで選択した値を渡すプログラムを作成しています。 下はそのソースです。 <html> <head></head> <body> <form method="POST" action="html2" onSubmit="入力チェック"> <table> <tr> <td>項目A-1</td> <td>項目A-2</td> <td> <select name="selname1"> <option value="0">0</option> <option value="1,11,111">1</option> <option value="2,22,222">2</option> </select> </td> </tr> <tr> <td>項目B-1</td> <td>項目B-2</td> <td> <select name="selname2"> <option value="0">0</option> <option value="3,33,333">3</option> <option value="4,44,444">4</option> </select> </td> </tr> </table> </form> </body> </html> 項目は全部で１０ほどあるので、途中省略しています。 SELECTで0以外が選ばれていた場合に、それに関連する項目情報と optionのvalueをhtml2に送信させて、一覧表のように表示させたいと思います。 JavaScriptのDOMやループ文を使うようですが、 私は専門外なので、どのような処理を組めばよいかわかりません。 どなたか、わかる方ご教示願います。
- 締切済み
- JavaScript
- JS テーブルのアニメーション表示
JavaScript テーブルのアニメーション表示 ここに１つのテーブルがあります。 「すべて表示」にチェックを入れたら、すべての列を表示します。 「３大栄養素」にチェックを入れたら、３大栄養素の列だけ表示します。 次の仕様を満たすには、どのようなコードになりますか？ ＜仕様＞ ・「３大栄養素」は表の項目セルに「S３」クラスを付与 ・チェックボックスで列の表示制御をする ・表示・非表示はスライド・アニメーション ［HTML］ <div class="container"> <form name="form2"> <label><input name="check2" type="checkbox">３大栄養素</label> </form> <table id="tbl3"> <caption>イチジクの栄養価</caption> <thead> <tr> <th>状態</th> <th>エネルギー</th> <th>水分</th> <th class="S3">たんぱく質</th> <th class="S3">脂質</th> <th class="S3">炭水化物</th> <th>灰分</th> <th>飽和脂肪酸</th> <th>不飽和脂肪酸</th> <th>コレステロール</th> <th>食物繊維</th> </tr> </thead> <tbody> <tr> <th>生</th><td>54 kcal</td><td>84.6g</td><td>0.6g</td> <td>0.1g</td><td>14.3g</td><td>0.4g</td><td>0.02g</td> <td>0.07g</td><td>0</td><td>1.9g</td> </tr> </tr> <th>乾</th><td>291 kcal</td><td>18.0g</td><td>3.0g</td> <td>1.1g</td><td>75.3g</td><td>2.5g</td><td>0.17g</td> <td>0.60g</td><td>0</td><td>10.7g</td> </tr> </tbody> </table> </div>
- 締切済み
- JavaScript
- セレクトボックス の 選択規制
今、フォームで入力画面を作っています。 その中にセレクトボックスが４つアリ、現在「未選択」の場合エラーチェックをするようにしています。 そして、ここにもうひとつのチェックを追加したいのですが皆目見当が付きません・・・ 条件 kaikai、bunkai1、bunkai2、heikai 全てが不参加の場合 "参加する会を最低一つは選択してください。"と言うコメントをだすというものです。 皆様よろしくお願いいたします。 ******** 現在の JavaScript ********* <SCRIPT language="JavaScript"> <!-- //フォームチェック function fcheck() { if(document.form1.kaikai.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.bunkai1.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.bunkai2.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.heikai.value == "未選択") { window.alert("選択してください"); return false; } } //--> </SCRIPT> ******** HTML内のフォーム ********* <table> <tr><th>1 ( * )</th> <td> <SELECT NAME="kaikai"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>2 ( * )</th> <td> <SELECT NAME="bunkai1"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>3 ( * )</th> <td> <SELECT NAME="bunkai2"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>4 ( * )</th> <td> <SELECT NAME="heikai"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> </table>
- ベストアンサー
- JavaScript
- セレクトボックスの内容を次のページで受け取る方法
<form action="./check.asp" method="POST"> <table> <tr> <td> <select name="year"> <option value="2006" >2006</option> <option value="2007" >2007</option> <option value="2008" >2008</option> </select> </td> </tr> <tr> <td align="center"><input type="submit" value="確認する"></td> </tr> </table> </form> として 次のページで YEAR =Trim(request("year")) Response.Write YEAR で受け取り表示しようとしていますが取れません。なぜですか？教えてください
- ベストアンサー
- Microsoft ASP
- tableのヘッダを固定したい
IE6,7,8でテーブルのヘッダを固定したいのですが うまくいきません。 条件は以下のとおりです。 ・width: ?%として大きさを可変にする。 ・ヘッダを固定する。 ・ボディにはスクロールバーをつける これまでwidthは固定で作成してきたのですが 可変にする場合どのようなcssにすればよいのでしょうか。 よろしくお願いします。 <div id="container"> <div class="headerTable"> <table border="1" cellspacing="0" cellpadding="0"> <thead> <tr> <th>あ</th> <th>い</th> <th>う</th> <th>え</th> </tr> </thead> </table> </div> <div class="bodyTable"> <table border="1" cellspacing="0" cellpadding="0" width="100%"> <thead> </thead> <tbody> <tr> <td>あaaaaaa</td> <td>い</td> <td>う</td> <td>え</td> </tr> </tbody> </table> </div> </div>
- 締切済み
- HTML
- １ページで２つのフォームをチェックしたいのですが…
１つのページに同じ項目のフォームを２つ作りました。 そしてそれにチェックを設けたいと思いフォームチェックのスクリプトを入れてみました。 が、しかし、、 上のフォームはチェックが動くのですが、 下のフォームは何を入れてもチェックがエラー検出をして 次のページに進めなくなってしまいます。。 こちらはどのようにしたら両方のチェックが働きつつ 次のページに値を渡せるのでしょうか？ 正しい書き方を教えてください。 よろしくお願いします。 <html> <head> <script language="JavaScript"> <!-- // 入力チェック function chkInputForm() { Error = new Array(); i = 0; // お客様の業種入力チェック if (document.forms[0].elements["part"].selectedIndex == 0) { Error[i] = "[ １・２の選択 ] は必須項目です。"; i++; } // 会社（事務所）のご住所入力チェック if (document.forms[0].elements["pref"].selectedIndex == 0) { Error[i] = "[住まい] は必須項目です。"; i++; } // 未入力があればアラート if (Error.length > 0) { ErrorText = Error.join("\n"); alert ("以下の項目は必須です。\n\n"+ErrorText); return false; } return true; } //--> </script> </head> <body> <form action="inquiry.php" method="post" onsubmit="return chkInputForm()"> <table class="table" summary="お問合せテーブル"> <tbody><tr> <th>１か２</th> <td> <select name="part" style="width: 200px;"> <option value="0">---ご選択下さい---</option> <option value="1">１</option> <option value="2">２</option> </select> </td> </tr> <tr> <th>住まいは</th> <td> <select name="pref" style="width: 200px;"> <option value="0">---ご選択下さい---</option> <option value="1">日本</option> <option value="2">海外</option> </select> </td> </tr> </tbody></table> <input class="iepng" name="button" value="送信" type="submit"> </form> <form action="inquiry.php" method="post" onsubmit="return chkInputForm()"> <table class="table" summary="お問合せテーブル"> <tbody><tr> <th>１か２</th> <td> <select name="part" style="width: 200px;"> <option value="0">---ご選択下さい---</option> <option value="1">１</option> <option value="2">２</option> </select> </td> </tr> <tr> <th>住まいは</th> <td> <select name="pref" style="width: 200px;"> <option value="0">---ご選択下さい---</option> <option value="1">日本</option> <option value="2">海外</option> </select> </td> </tr> </tbody></table> <input class="iepng" name="button" value="送信" type="submit"> </form> </body> </html>
- 締切済み
- HTML
- プルダウンメニューの利用
htmlのプルダウンメニューを使用した値計算のインタフェースを作成したいと思っています。 プルダウンメニューに設定するメニュー項目に値を設定し、 onChangeを使用して、その値だけをPHPプログラムに渡すようにしたいのですが、 JavaScript部分をどのように書けばいいのか判りません。 どなたかご教授お願いいたします。 <form name="formtest" action="test.php" method="post"> <table> <tr> <th>カテゴリ*</th> <td> <SELECT NAME="iPlanet" onchange=""> <OPTION VALUE="9" selected>初期値 <OPTION VALUE="0">サンプル1 <OPTION VALUE="1">サンプル2 </SELECT> </td></tr> </table> </form> onchangeでValueの値をPHPに送りたいのです。 よろしくお願いします。
- ベストアンサー
- JavaScript
- このhtmlの書き方は正しいでしょうか。
下記の情報の配置の仕方は正しいでしょうか？ 実際に使用するときは<tbody>～</tbody>を複数増やします。 サンプルでは２つですが、これが400以上になります。 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" /> <title></title> <style type="text/css"> body { background-color: #f5e088; margin: 0; padding: 0; font-size: 15px; } #base { width: 600px; margin: 0 auto; background-color: #fff; } table#ttt { width: 600px; background-color: #ccc; border: 2px solid #000; padding: 15px 0px; } table#ttt th, table#ttt td { width: 100px; } td#kkk { text-align:center; } table#ccc th { color: #f00; width: 60px; } table#ccc td { } .shashin, td.shousai { width: 150px; background-color: #ff0; } </style> </head> <body> <div id="base"> <form action="#"> <table id="ttt"> <tr> <th>市</th> <td> <select name=""> <option value="">指定していません</option> <option value="横浜市">横浜市</option> <option value="鶴見区">鶴見区</option> <option value="神奈川区">神奈川区</option> <option value="西区">西区</option> </select> </td> <th>町村</th> <td> <select name=""> <option value="">指定していません</option> <option value=""></option> <option value=""></option> </select> </td> </tr> <tr> <th>小学校区</th> <td> <select name=""> <option value="">指定していません</option> <option value=""></option> <option value=""></option> </select> </td> <th>中学校区</th> <td> <select name=""> <option value="">指定していません</option> <option value=""></option> <option value=""></option> </select> </td> </tr> <tr> <th>データ</th> <td> <select name=""> <option value="">指定していません</option> <option value="500">500値未満</option> <option value="1000">500値以上1000値未満</option> <option value="1500">1000値以上1500値未満</option> </select> </td> <th>レベル</th> <td> <select name=""> <option value="">指定していません</option> <option value="30">30Lv未満</option> <option value="60">30Lv以上60Lv未満</option> <option value="90">60Lv以上90Lv未満</option> <option value="100">90Lv以上100Lv以下</option> </select> </td> </tr> <tr> <td colspan="4" id="kkk"> <input type="button" id="" value="検索" onclick=""> </td> </tr> </table> </form> 方法その１ <table id="ccc"> <tbody> <tr> <td rowspan="3" class="shashin"><img src="" alt="画像"></td> <th>場所</th><td colspan="7">神奈川県横浜市金沢区</td> <td rowspan="2" colspan="2" class="shousai"><img src="" alt="詳細はこちら"></td> </tr> <tr> <th>データ</th><td colspan="3">525値</td> <th>レベル</th><td colspan="3">53Lv</td> </tr> <tr> <th>小学校区</th><td colspan="4">市立第一横浜小学校</td> <th>中学校区</th><td colspan="4">市立第一横浜中学校</td> </tr> </tbody> <tbody> <tr> <td rowspan="3" class="shashin"><img src="" alt="画像"></td> <th>場所</th><td colspan="7">神奈川県横浜市金沢区</td> <td rowspan="2" colspan="2" class="shousai"><img src="" alt="詳細はこちら"></td> </tr> <tr> <th>データ</th><td colspan="3">525値</td> <th>レベル</th><td colspan="3">53Lv</td> </tr> <tr> <th>小学校区</th><td colspan="4">市立第一横浜小学校</td> <th>中学校区</th><td colspan="4">市立第一横浜中学校</td> </tr> </tbody> </table> </div> </body> </html> このような内容を作る時はテーブルが一番正しいのでしょうか？ 最も正しい方法を教えて頂きたいです。
- ベストアンサー
- HTML
補足
DBから取得したmenuDispFlgが0のときは"制御しない"を、1のときは”制御する"を選択済みにするよう分岐させたいのです。