类别表，其中包含属性id（pk）和cat_name
类别表
id cat_name
1艺术
2技术
子类别表，其中包含属性s_id（pk）name和id（fk）
子类别表
s_id name id
1占星术1
2 mobile 2
这是Submit_story.jsp页面
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="java.sql.*" %>
<%@page import="java.io.*" %>
<%@page import="com.blog.ConnectionManager"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page import="com.blog.*"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.ArrayList"%>
<%@ page import="java.util.List" %>
<%
List<category_Bean> category = new DAO().getcategory() ;
request.setAttribute("category",category);
%>
<!-- String cat=null; -->
<html>
<head>
<script type="text/javascript" src="js/script_reg.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title align=center > Submit Story </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<%
Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/blogspot","root","mysql");
%>
<%
String sql3 = "select * from author";
Statement stmt3 = con.createStatement();
ResultSet rs3 = stmt3.executeQuery(sql3);
%>
<div id="container">
<div id="header"><h1><i>Blogspot.in</i></h1>
</div>
<div id="body_contant_admin">
<div id="hello">
</div>
<div id="form_container_reg">
<fieldset>
<legend> <b> SUBMIT STORY </b> </legend>
<form name="input" action="submit_story" method="post">
<div style="color: #000F1F;">${msg}</div>
<div id="author_reg">
<table>
<tr>
<td class="td1" class="text_entry"><b>Category:</b></td>
<td class="td1" class="text_entry">
<select name="category" id ="category_id" onchange="callajax()" >
<option value="0">Select</option>
<c:forEach var="category" items="${category}">
<option value="${category.id}">${category.cat_name}</option>
</c:forEach>
</select>
<%
%>
</td>
</tr>
<tr>
<td class="td1" class="text_entry"><b> Subcategory: </b></td>
<td class="td1" class="text_entry">
<select name="subcategory" id="subcategoryId">
<option value='0'>--Select--</option>
</select>
</td>
</tr>
<tr>
<td class="td1" class="text_entry"><b>Author Name:</b> </td>
<td class="td1" class="text_entry">
<select name="name">
<option selected="selected"> Select Author Name </option>
<% while(rs3.next()){ %>
<option><%= rs3.getString(3)%></option>
<!-- String cat = request.getString("category"); -->
<% } %>
</select>
</td>
</tr>
<tr>
<td class="td1"><b>Title:</b></td>
<td class="td1"><input type="text" name="title" placeholder="enter first Name " class="text_entry"></td>
</tr>
<tr>
<td class="td1" class="text_entry"><b>Description:</b> </td>
<td class="td1"> <textarea style="width: 300px; height: 100px;" name="description" placeholder="Write your story here" class="text_entry"></textarea></td>
</tr>
</table>
</div>
<br>          <input type="submit" value="Submit" onclick="reg_validateForm()" align="middle"/>
    <input type="reset" value="Reset" align="middle"/><br><br>
<!--
<a href="author_home.jsp" title="admin home" >
<input type="button" name="myaccount" value="Admin home">
</a>
-->
              <input type="button" value="Author home" onclick="fun1()"/>
</form>
</fieldset>
</div>
</div>
<div id="footer">
<div id="menu">
<table >
<tr>
<td> <a href="home.jsp" title="Home" >Home</a> </td>
<td> <a href="category.jsp" title="Category" >Category</a> </td>
<td> <a href="subcategory.jsp" title="Subcategory" >Subcategory</a> </td>
<td> <a href="aboutus.jsp" title="aboutus" >About us</a> </td>
<td> <a href="contactus.jsp" title="Countactus" >Contact us</a> </td>
</tr>
</table>
</div>
<div id="copyright">©copyright Jk Technosoft Ltd. ALL Rights Reserved.
</div>
</div>
</div>
<script type="text/javascript">
function fun1()
{
location.href="author_home.jsp";
}
function getXMLHttpRequestObject()
{
var xmlhttp;
try
{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
try
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E)
{
xmlhttp = false;
}
}
if (!xmlhttp)
{
try
{
xmlhttp = new XMLHttpRequest();
}
catch (e)
{
xmlhttp = false;
}
}
return xmlhttp;
}
function callajax()
{
var http = new getXMLHttpRequestObject();
var url="<c:out value="${pageContext.request.contextPath}"/>/subcategory_ajax.jsp?categoryId="+document.getElementById('category_id').value;
http.open("GET", url, true);
http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
http.timeout=1000;
http.onreadystatechange = function()
{
if(http.readyState == 4)
{
if(http.status==200)
{
document.getElementById("subcategoryId").innerHTML=http.responseText;
}
}
}
http.send(null);
}
</script>
</body>
</html>
这是category_Bean.java
package com.blog;
import java.io.Serializable;
public class category_Bean {
public int id;
public String cat_name;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getCat_name() {
return cat_name;
}
public void setCat_name(String cat_name) {
this.cat_name = cat_name;
}
}
这是DBUtil.java
package com.blog;
import java.sql.*;
import javax.sql.DataSource;
import javax.naming.InitialContext;
public class DBUtil {
public static Connection getConnection() throws SQLException {
Connection con=null;
try{
if(con== null) {
javax.naming.Context context = new InitialContext();
if(context == null )
throw new Exception("Boom - No Context");
DataSource dataSource =(DataSource)context.lookup("java:comp/env/jdbc/msplash");
if (dataSource != null)
con = dataSource.getConnection();
}
return con;
} catch(SQLException e){
throw new SQLException(e.toString());
} catch(Exception e){
throw new SQLException(e.toString());
}
}
public static void closeResource(Connection con,PreparedStatement pst,ResultSet rst){
if (rst != null)
try {
rst.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
if (pst != null) {
try {
pst.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
if (con != null) {
try {
con.close();
} catch (SQLException e) {
e.printStackTrace();
}
}
}
}
这是subcategory_ajax.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@page import="com.blog.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<%@page import="com.*"%>
<%=new DAO().getsubcategory(request.getParameter("categoryId"))%>
</body>
</html>
这是DAO.java
package com.blog;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
public class DAO {
public List<category_Bean> getcategory() {
Connection connection = null;
PreparedStatement statement=null;
ResultSet resultSet=null;
List<category_Bean> category = new ArrayList<category_Bean>();
try {
connection = DBUtil.getConnection();
if(connection!=null)
{
statement = connection.prepareStatement("select *from category");
resultSet = statement.executeQuery();
while(resultSet.next())
{
category_Bean cat = new category_Bean();
cat.setId(resultSet.getInt("id"));
cat.setCat_name(resultSet.getString("cat_name"));
category.add(cat);
}
}
}catch (Exception e) {
category=null;
}finally{
DBUtil.closeResource(connection, null, resultSet);
}
return category;
}
public String getsubcategory(String categoryId){
StringBuffer buf=new StringBuffer();
Connection con=null;
ResultSet resultSet=null;
PreparedStatement pst=null;
try{
con=DBUtil.getConnection();
if(con!=null){
String query="select s_id,name from subcategory where id='"+categoryId+"'";
pst=con.prepareStatement(query);
resultSet=pst.executeQuery();
while(resultSet.next()){
buf.append("<option value='"+resultSet.getInt("id")+"'>");
buf.append(resultSet.getString("name")+"</option>");
}
}
}catch(Exception ex){
ex.printStackTrace();
}finally{
DBUtil.closeResource(con, null, resultSet);
}
return buf.toString();
}
}
错误是在下拉列表中没有显示任何类别或子类别。谢谢提前。
答案 0 :(得分：0)
你有这个HTML：
<select name="subcategory" id="subcategoryId">
<option value='0'>--Select--</option>
</select>
你调用Ajax来填充它，最后做document.getElementById("subcategoryId").innerHTML=http.responseText;。
现在，您的Ajax发送请求的JSP文件将返回完整的HTML文件。也就是说，它有<!DOCTYPE和<html>以及<body>等等。
为什么???什么样的HTML在<select>标记的innerHTML中？选项列表，而不是完整的HTML文件。
那么，Ajax调用的JSP不应该只返回一个选项列表吗？
<option value='0'>--Select--</option>
<option value='1'>1</option>
<option value='2'>2</option>