JSP文件可以为ajax调用返回一个json对象吗?

时间:2014-03-14 00:28:51

标签: ajax json jsp

我想调用一个jsp文件将json对象返回给我的ajax调用。可能吗? 如果有可能,请你分享一些jsp文件和jquery ajax代码的示例代码?提前谢谢。

1 个答案:

答案 0 :(得分:1)

很多很多例子都在网上,猜你是小懒,在搜索中让我分享一个例子,我在服务器端使用servlet

创建一个bean,

public class Countries {     
 public Countries(String code,String name)
        {      
          this.setCode(code);
          this.setName(name);
        }     
 public Countries() {}   

    private String code;
    private String name;           

 public void setCode(String code) {
  this.code = code;
 }
 public String getCode() {
  return code;
 }    
 public void setName(String name) {
  this.name = name;
 }    
 public String getName() {
  return name;
 }

DAO 类来添加数据库中的数据甚至硬编码数据,

ArrayList<Countries> countryList = new ArrayList<Countries>();
while(rs.next()) { 
             Countries country=new Countries();
             country.setCode(rs.getString("Code"));
             country.setName(rs.getString("Name")); 
             countryList.add(country);
            }

之后创建一个 servlet ,它从DAO获取数据并将其发送到JSP,

ArrayList<Countries> country=new ArrayList<Countries>();
  country=FetchData.getAllCountries();
  Gson gson = new Gson();
  JsonElement element = gson.toJsonTree(country, new TypeToken<List<Countries>>() {}.getType());

  JsonArray jsonArray = element.getAsJsonArray();
  response.setContentType("application/json");
  response.getWriter().print(jsonArray);  
 }

最后要查看 JSP

<script type="text/javascript">
$(document).ready(function() {
 $("#tablediv").hide();
     $("#showTable").click(function(event){
           $.get('PopulateTable',function(responseJson) {
            if(responseJson!=null){
                $("#countrytable").find("tr:gt(0)").remove();
                var table1 = $("#countrytable");
                $.each(responseJson, function(key,value) { 
                     var rowNew = $("<tr><td></td><td></td></tr>");
                        rowNew.children().eq(0).text(value['code']); 
                        rowNew.children().eq(1).text(value['name']); 

                });
                }
            });
            $("#tablediv").show();          
  });      
});
</script>
<input type="button" value="Show Table" id="showTable"/>
<div id="tablediv">
<table cellspacing="0" id="countrytable"> 
    <tr> 
        <th scope="col">Code</th> 
        <th scope="col">Name</th> 

    </tr> 
</table>
</div>

希望它有所帮助!!