0

2 つの HTML ドロップダウン リストがあり、それらの値は jsp を使用してデータベースから取得されます。

<%
  String query =" SELECT question_text,question_id FROM questions WHERE id = ?";
   PreparedStatement stmt = conn.prepareStatement(query);
   stmt.setString(1,request.getParameter("QID"));
   ResultSet rs = stmt.executeQuery();
    if(!rs.next()) {} else {%>
   <form action="#" method="post">
   <p> First Question </p>
   <select name="currentQuestion">
<%do{%> 
<option value="<%=rs.getString("question_id")%>"><%=rs.getString("question_text")%>  </option>
<%}while(rs.next());}%>
</select>

<%                  
  String query =" SELECT question_text,question_id FROM questions WHERE id = ? AND question id != ? ";
  PreparedStatement stmt = conn.prepareStatement(query);
  stmt.setString(1,request.getParameter("QID"));
  stmt.setString(2,CHOOSEN QUESTION);
  ResultSet rs = stmt.executeQuery();
  if(!rs.next()) {} else {%>
  <p> Next Question </p>
 <select name="currentQuestion">
 <%do{%>    
  <option value="<%=rs.getString("question_id")%>"><%=rs.getString("question_text")%></option>
 <%}while(rs.next());}%>
  </select>
  </form>       

さて、ユーザーが最初のドロップダウン リストから特定の質問を選択すると、2 番目のドロップダウン リストの値にはその質問が含まれません。誰もそれを行う方法を知っていますか?

4

1 に答える 1

1
  1. CHOOSEN QUESTIONコードのどこにも設定しません。
  2. idあなたは彼と要素nameのタグを忘れましたoption
  3. CHOOSEN QUESTIONスペースが含まれているため、変数の名前は無効です。
  4. ユーザーがオプションを選択する前にこのコードがサーバー側で実行されるため、これを実行しようとしている方法で実行することはできません。おそらくやりたいことは、すべてのオプションをロードし(オプションが多すぎない場合)onChange、最初のドロップボックスのイベントで2番目のドロップボックスを更新するJS / jQueryを作成することです(ユーザーがオプションを選択する前に-あなたおそらく2番目のドロップボックスを無効にしたいでしょう)
  5. おそらくやりたいもう1つのことは、form最終的にユーザーの選択をJSP(サーバー側)に送信するを作成することです。
  6. AJAXを使用して同じ動作を実現することもできます。その方法の例は、ここにあります。

UPDATE(JSを使用してオプションを変更するためのサンプルコード):

<html>
<head>
<script type="text/javascript" >
<!-- hide

function update(x){
    if (x != "null") {
        if (x == "1") {
            var jumpmenu2 = document.getElementById("jumpmenu2");
            var newOption1 = document.createElement('option');
            newOption1.text = "a"; //HERE You'll use newOption1.text = "<?php echo $db_option_text;?>"; 
            newOption1.value = "1"; //HERE You'll use newOption1.text = "<?php echo $db_option_value;?>"; 
            var newOption2 = document.createElement('option');
            newOption2.text = "b"; // same like above
            newOption2.value = "2"; // same like above
            var newOption3 = document.createElement('option');
            newOption3.text = "c"; // same like above
            newOption3.value = "3"; // same like above
            jumpmenu2.remove(jumpmenu2.length-1);
            jumpmenu2.remove(jumpmenu2.length-1);
            jumpmenu2.remove(jumpmenu2.length-1);
            try {
                // For standard browsers
                jumpmenu2.add(newOption1,null);
                jumpmenu2.add(newOption2,null);
                jumpmenu2.add(newOption3,null);
            }
            catch (ex) {
                // For Microsoft Internet Explorer and other non-standard browsers.
                jumpmenu2.add(newOption1);
                jumpmenu2.add(newOption2);
                jumpmenu2.add(newOption3);
            }
        }
        else if (x == "2"){
            var jumpmenu2 = document.getElementById("jumpmenu2");
            var newOption1 = document.createElement('option');
            newOption1.text = "d";
            newOption1.value = "1";
            var newOption2 = document.createElement('option');
            newOption2.text = "e";
            newOption2.value = "2";
            var newOption3 = document.createElement('option');
            newOption3.text = "f";
            newOption3.value = "3";
            jumpmenu2.remove(jumpmenu2.length-1);
            jumpmenu2.remove(jumpmenu2.length-1);
            jumpmenu2.remove(jumpmenu2.length-1);
            try {
                // For standard browsers
                jumpmenu2.add(newOption1,null);
                jumpmenu2.add(newOption2,null);
                jumpmenu2.add(newOption3,null);
            }
            catch (ex) {
                // For Microsoft Internet Explorer and other non-standard browsers.
                jumpmenu2.add(newOption1);
                jumpmenu2.add(newOption2);
                jumpmenu2.add(newOption3);
            }
        }
    }
}

// end hide -->
</script>
</head>
<body>
<form name="form1" id="form1">
<select name="jumpmenu" name="jumpmenu" onChange="update(document.form1.jumpmenu.options[document.form1.jumpmenu.options.selectedIndex].value)">
<option value=1>1</option>
<option value=2>2</option>
</select>
</form>
<select name="jumpmenu2" id="jumpmenu2">
<option value=a id=1>a</option>
<option value=b id=2>b</option>
<option value=c id=3>c</option>
</select>
</body>
</html>
于 2012-07-11T17:35:29.407 に答える