Ajax와 JSP를 사용하여 Multiselect로 계단식 드롭 다운

Question

JSP 페이지에 다중 선택 드롭 다운 값을 보냈습니다. 아래는 다중 선택 값을 보내는 AJAX 코드입니다. JSP PAge에는 데이터베이스에서 읽고 그 값을 다른 드롭 다운에 표시하는 SQL 쿼리가 포함되어 있습니다. 아래 코드는 다중 선택이 아닌 선택을 기반으로 계단식 드롭 다운 값만 표시합니다. apps.jsp에는 모든 값이 아닌 하나의 값만 전송됩니다. 나는 몇 가지 변화를 시도했지만 효과가 없었습니다. 아래는 나와 함께 사용할 수있는 최선의 작업 코드입니다. 첫 번째 드롭 다운에서 다중 선택을 기준으로 두 번째 드롭 다운 표시 값을 얻으려면 어떤 도움이 필요합니까? 단일 드롭 다운은 코드 아래에서 잘 작동합니다. 고맙습니다.

<select multiple="multiple" name="RequirementFor" id="RequirementFor" onchange="showState(this.value);"> 

<option value="1">Test1</option> 
    <option value="2">Test2</option> 
<option value="3">Test3</option> 
<option value="4">Test4</option> 
</select> 
<div id="plat"><select name="Platform" id="Platform" multiple="multiple"  onchange='showState2(this.value)'> 

    </select></div> 
//AJAX Code 
var xmlHttp ; 
var xmlHttp; 
function showState(str){ 

if (typeof XMLHttpRequest != "undefined"){ 
xmlHttp= new XMLHttpRequest(); 
} 
else if (window.ActiveXObject){ 
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP"); 
} 
if (xmlHttp==null){ 
alert("Browser does not support XMLHTTP Request"); 
return; 
} 
var url="apps.jsp"; 
url +="?value=" +str; 
xmlHttp.onreadystatechange = stateChange; 
xmlHttp.open("GET", url, true); 
xmlHttp.send(null); 
} 

function stateChange(){ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
document.getElementById("plat").innerHTML=xmlHttp.responseText ; 
} 
} 

아래는 JSP 쿼리 (apps.jsp) 페이지의 코드입니다.

Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver").newInstance(); 
Connection con = DriverManager.getConnection("jdbc:sqlserver://localhost", "username", "password"); 
Statement stmt; 
ResultSet rs; 
String[] funID= request.getParameterValues("value"); 
String conCat = ""; 
try{ 
if(funID.length>0) 
{ 
for(int i=0;i<funID.length; i++) 
{ 
    conCat = funID[i] +" "+ "OR" + " "+ "FU_DEPARTMENT_ID= " + conCat; 
} 
conCat = conCat.substring(0, conCat.length() - 22); 
} 
} 
catch(Exception e) 
{out.println(e);} 

String buffer="<select name='state' multiple='multiple'><option value='-1'>Select</option>"; 


try 
{ 

     String sqlSelect1="Select FU_ID, FU_NAME from UNIT where FU_DEPARTMENT_ID ="+conCat+" ORDER BY FU_NAME ASC"; 

    stmt = con.createStatement(); 
rs = stmt.executeQuery(sqlSelect1); 
    while(rs.next()){ 
    buffer=buffer+"<option value='"+rs.getString("FU_ID")+"'>"+rs.getString("FU_NAME")+"</option>"; 
    } 
buffer=buffer+"</select>"; 
response.getWriter().println(buffer); 
stmt.close(); 
rs.close(); 
con.close(); 
} 
catch(Exception e){ 
    System.out.println(e); 
} 

Answer 1

다중 값을 가져 오는 방식을 변경해야한다고 생각합니다. 어떤 사람들은 다음을 좋아합니다 :

<select multiple="multiple" name="RequirementFor" id="RequirementFor" onchange='getMultiple(this);'> 
    <option value="1">Test1</option> 
    <option value="2">Test2</option> 
    <option value="3">Test3</option> 
    <option value="4">Test4</option> 
</select> 

<script> 
    var selected; 
    function getMultiple(ob) { 
     selected = new Array(); 
     for (var i = 0; i < ob.options.length; i++) { 
      if (ob.options[ i ].selected) { 
       selected.push(ob.options[ i ].value); 
      } 
     } 
     var str = ""; 
    for (var i = 0; i < selected.length; i++) { 
     str += "&value=" + selected[i]; 
    } 
    console.log(str); 

      // --> your ajax code 

    } 

</script>