Values based on another drop down

plz check d following code 😔
[sookie]

dropdown.jsp
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<HTML>

<SCRIPT TYPE="text/javascript">
/* Function called on change event of Dept Drop Down */
function populateSubjectMenu() {
var selectedIndexVal = document.getElementById("sem_select").selectedIndex;
var selectedSemVal =document.getElementById("sem_select").options[selectedIndexVal].value;
selectedIndexVal = document.getElementById("dept_select").selectedIndex;
var selectedDeptVal =document.getElementById("dept_select").options[selectedIndexVal].value;
callAjaxFunction(selectedSemVal,selectedDeptVal);

}
/* function called to do Ajax Request */
function callAjaxFunction(semVal,deptVal){
var url="populateSubjects.jsp?semVal="+semVal+"&"+deptVal;
var xmlHttp;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
var xmlHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.open('POST', url, true);
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
updatepage(xmlHttp.responseText);
}
}
xmlHttp.send(url);
}
/* Call back function of Ajax Response*/
function updatepage(response){
//alert(str);
document.getElementById("result").innerHTML = response;
}
</SCRIPT>
<BODY>
<FORM>
Semester :
<label>
<select name="sem_select" id="sem_select" onchange="populateSubjectMenu();">
<option value="">-- Select --</option>
<option value="1">First</option>
<option value="2">Second</option>
<option value="3">Third</option>
<option value="4">Fourth</option>
<option value="5">Fifth</option>
<option value="6">Sixth</option>
<option value="7">Seven</option>
<option value="8">Eight</option>
</select>
</label>

Department :
<select name="dept_select" id="dept_select" onchange="populateSubjectMenu();">
<option value="">-- Select --</option>
<option value="cse">Computer Science & Engineering</option>
<option value="ec">Electronics & Communication</option>
<option value="it">Information Technology</option>
<option value="ft">Food Technology</option>
<option value="ee">Electrical Engineering</option>
<option value="ei">Electronics & Intrumentation</option>
</select>

<div id="result"></div>
</FORM>
</BODY>
</HTML>

populateSubject.jsp

<%@page import="java.sql.*"%>
<%@page import="javax.sql.*"%>
<%
//open a database connection
Connection conn = null;
PreparedStatement stmt = null;
ResultSet rs = null;
try{
// String url = "jdbc:sqlserver://[DB Server IP]:[DB Server Port];";
String url = "jdbc:derby://localhost:1527;";

//String driver = "com.microsoft.sqlserver.jdbc.SQLServerDriver";
String driver = "org.apache.derby.jdbc.ClientDriver";

String userName = "[app]";
String password = "[root]";
String semVal=request.getParameter("semVal");
String deptVal=request.getParameter("deptVal");

Class.forName(driver).newInstance();
conn = DriverManager.getConnection(url,userName,password);

//String s="Select sub_code,sub_name from subject_details where semester ="+ semVal +" and department='"+ deptVal +"'";
String s="Select sub_code,sub_name from subject_details where semester ="+ semVal +" and department='"+ deptVal +"'";
stmt=conn.prepareStatement(s);
rs=stmt.executeQuery();

out.print("<p class='style9'>Subjects : ");
out.print("<select name='sub_select' id='sub_select'>");
out.print("<option value=''>--Select--</option>");

while (rs.next()) {
//String sub_code= rs.getString("sub_code");
//String sub_name = rs.getString("sub_name");
// out.print("<option value='"+sub_code+"'>"+sub_name+"</option>");

String sub_code= rs.getString("sub_code");
String sub_name = rs.getString("sub_name");
out.print("<option value='"+sub_code+"'>"+sub_name+"</option>");

}
out.print("</select>");

}

catch(Exception e ){
out.print("<div><font color='red'>The following exception was thrown:</font></div>");
}
finally{
try{if(rs!=null)rs.close();}catch(SQLException e2){out.print(e2);}
try{if(stmt!=null)stmt.close();}catch(SQLException e2){out.print(e2);}
try{if(conn!=null)conn.close();}catch(SQLException e2){out.print(e2);}
}
%>