嗨根据以往的下拉列表中选择一个下拉列表,我有一个包含两个下拉列表形式的JSP页面,填充用ajax
- 第一个用于显示国名和
- 第二个显示相应国家下的国家。
我有一个Mysql数据库分别包含两个表的国家和州。
我想:
我需要填充从使用Ajax数据库,其中从数据库中的数据必须转换为JSON对象的第二下拉并给予响应为JSON object.Then填充第二个下拉的基于这个响应的Json对象。
ISSUE我面对:
我的问题是,当我选择在第一个下拉列表中的值的第二个下拉列表中填充的值“[对象的对象],[对象对象],[对象对象]'而不是显示相应的状态名称。
有人请帮我解决这个problem.Here是我的代码,我迄今所做
的index.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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>AJAX calls to Servlet using JQuery and JSON</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function() {
$('#country').change(function(event) {
var $country=$("select#country").val();
$.get('ActionServlet',{countryname:$country},function(responseJson) {
var $select = $('#states');
$select.find('option').remove();
$.each(responseJson, function(index, name) {
$('<option>').val(index).text(name).appendTo($select);
});
});
});
});
</script>
</head>
<body>
<h1>AJAX calls to Servlet using JQuery and JSON</h1>
Select Country:
<select id="country">
<option selected="selected">Select Country</option>
<option value="1">India</option>
<option value="2">china</option>
</select>
<br/>
<br/>
Select State:
<select id="states">
<option selected="selected">Select State</option>
</select>
</body>
</html>
ActionServlet.java:
package ajaxdemo;
import java.io.IOException;
import java.sql.*;
import java.util.*;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import com.google.gson.Gson;
public class ActionServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public ActionServlet() {
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
JSONArray cellarray = new JSONArray();
JSONObject cellobj = null; //new JSONObject();
JSONObject jo=new JSONObject();
String country=request.getParameter("countryname");
try{
Class.forName("com.mysql.jdbc.Driver").newInstance();
Connection con =DriverManager.getConnection("jdbc:mysql://localhost:
3306/test","root","root");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery("Select * from state
where countryid='"+country+"' ");
while(rs.next()){
cellobj = new JSONObject();
cellobj.put("id", rs.getString(1));
cellobj.put("name", rs.getString(3));
cellarray.add(cellobj);
}
jo.put("arrayName",cellarray);
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(jo.toString());
}
catch(Exception e){
System.out.println(e);
}
}
protected void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
}
}
在此先感谢
为什么不会使用$ select.html(response.html); 然后确保在您的服务器端输出选择的选项 – talsibony
您可以发布从服务器端收到的完整json结构 – dreamweiver
您可以执行console.log(responseJson),然后在您的浏览器中查看它的外观如何相信它应该是这样的{['id':'1'],['name':'somename']} – talsibony