6
我正在研究j2ee應用程序。在我的應用程序中，我有一個下拉列表（或選擇元素）。我想用JSON數據填充這個下拉列表作爲Ajax響應。如何在JQuery中使用JSON數據填充dropdownlist作爲ajax響應
下面是我的代碼：生成一個JSON響應
服務器端代碼（json_source.java）。 ：
package demo.model;
import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.google.gson.*;
/**
* Servlet implementation class json_source
*/
public class json_source extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
JsonArray data_json=new JsonArray();
Statement st_loginId=null;
ResultSet rs_loginId=null;
try
{
Connection con=null;
Class.forName("oracle.jdbc.OracleDriver");
/* Connection String for "OPERWH"(exadata) Database */
con=DriverManager.getConnection("jdbc:oracle:thin:*************","*****","*****");
con.setAutoCommit(true);
st_loginId=con.createStatement();
rs_loginId=st_loginId.executeQuery("select login_id \"LOGIN ID\" from user_access");
//System.out.println("entered in frame_login_code");
int login_val=0;
JsonObject json_response=new JsonObject();
while(rs_loginId.next())
{
login_val++;
JsonObject json=new JsonObject();
json.addProperty("value", "login"+login_val);
json.addProperty("text", rs_loginId.getString(1));
data_json.add(json);
}
System.out.println(data_json);
json_response.add("aaData", data_json);
response.setContentType("application/Json");
response.getWriter().write(json_response.toString());
System.out.println(json_response);
}
catch(Exception ex)
{
System.out.println("Exception occured during retrieval of Login_Id in ComboBox :"+ex);
ex.printStackTrace();
}
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
}
}
並通過上述服務器端代碼成功地生成JSON數據：
{
"aaData": [{
"value": "login1",
"text": "kapils"
}, {
"value": "login2",
"text": "davidn"
}, {
"value": "login3",
"text": "alanp"
}]
}
和下面是我的客戶端代碼（source1.jsp），其生成Ajax請求：
（使用$ .ajax（））：
<script type="text/javascript">
$(document).ready(function()
{
$('#id_trial').click(function() {
alert("entered in trial button code");
$.ajax({
type: "GET",
url:"/demo_trial_application/json_source",
dataType: "json",
success: function (data) {
$.each(data.aaData,function(i,data)
{
alert(data.value+":"+data.text);
var div_data="<option value="+data.value+">"+data.text+"</option>";
alert(div_data);
$(div_data).appendTo('#ch_user1');
});
}
});
});
});
</script>
<body>
<div id="div_source1">
<select id="ch_user1" >
<option value="select"></option>
</select>
</div>
<input type="button" id="id_trial" name="btn_trial" value="Trial Button..">
</body>
或使用（$ .getJSON（））：
$.getJSON("/demo_trial_application/json_source", function (data) {
$.each(data.aaData, function (i, data) {
var div_data = "<option value=" + data.value + ">" + data.text + "</option>";
alert(div_data);
$(div_data).appendTo('#ch_user1');
});
});
現在，當我點擊按鈕（#id_trial），服務器端代碼執行成功，併爲創建結果JSON對象。 但我沒有得到使用jQuery的ajax調用的Success參數的回調函數中的「JSON響應」。
除了jQuery的ajax調用我也嘗試用$.getJSON函數來接收JSON響應..但我沒有得到JSON數據。
那麼請告訴我，如果我的代碼中有任何錯誤，以及如何使用上面的代碼獲取JSON數據並填充下拉列表。
我想填充我用Ajax響應JSON數據下拉列表。 請幫我解決這個問題......它對我的應用非常緊迫。
你看着螢火蟲，看看客戶端json是否到達？ –
套件@我檢查了您的ajax代碼與php json數據，其工作正常。我正在使用jQuery v1.10.2。我不認爲JavaScript有錯誤。 –
檢查your.each（）循環http://stackoverflow.com/questions/2342371/jquery-loop-on-json-data-using-each –