如何使用jquery和ajax调用从JsonObject获取值？

我有一个从弹簧控制器返回的JsonObject来填充选择框。但我不能将其加载到阿贾克斯如何使用jquery和ajax调用从JsonObject获取值？

这里是我的jQuery代码

$("#category").click(function(){ 

    $.ajax({ 
     type: "POST", 
     url: "loadSelectBox", 
     dataType: 'json', 
     success: function(data){ 
      $("#category").empty(); 
      var options = ''; 
      for(var i = 0; i <= data.length - 1; i++){ 
       options += "<option value='" + data[i].id + "'>" + data[i].name + "</option>"; 
      } 
      $("#category").append(options); 
      $("#category").trigger('chosen:updated'); 
     } 
    }); 

})

我的控制器代码是

@PostMapping(name="loadSelectBox") 
    public JSONObject getCategoryJsonObj() throws Exception{ 
     System.out.println("loadSelectBox:::::: "); 
     JSONObject catJsonObj=new JSONObject(); 
     try { 
      ArrayList<CategoryDTO> catDTOList=globalCatList; 
      System.out.println("catDTOList::: " +catDTOList); 
      ArrayList<String> dbList=rawDataProcessService.getCurrentCategoriesInserted(structureID); 
      System.out.println("dbList:: " +dbList); 

      System.out.println("catDTOList before removing : " +catDTOList.size()); 
      if(dbList!=null && dbList.size() >0){ 
       for(int db=0;db<dbList.size();db++){ 
        String dbData=dbList.get(db); 
        for(int cat=0;cat<catDTOList.size();cat++){ 
         CategoryDTO dto=catDTOList.get(cat); 
         String currentData=dto.getCategory(); 
         if(dbData.trim().equals(currentData)){ 
          catDTOList.remove(cat); 
         } 

        } 
       } 
       System.out.println("catDTOList after removing : " +catDTOList.size()); 
       for(int cat=0;cat<catDTOList.size();cat++){ 
        CategoryDTO categoryDTO=catDTOList.get(cat); 
        String categoryValue=categoryDTO.getCategory(); 
        System.out.println("categoryValue: ::" + categoryValue); 
        catJsonObj.put(categoryValue, categoryValue); 
       } 
       System.out.println("catJsonObjLLL " +catJsonObj); 
      }else{ 

      } 
     } catch (Exception e) { 
      throw e; 
     } 
     return catJsonObj; 

    }

的JSONObject从春天控制器将如下键值对：

{"MONTH":"MONTH","TYPE OF DATA 5":"TYPE OF DATA 5","TYPE OF DATA 3":"TYPE OF DATA 3","TYPE OF DATA 4":"TYPE OF DATA 4"}

我无法将上面的jsonObject值加载到选择框中。

帮助表示赞赏，那种for循环是用来通过data.In的情况下，它只是一个object.So遍历的对象检索键值对的数组迭代感谢

来源

2017-07-27 eThan_hunT

可以显示阿贾克斯 – JYoThI

我没有得到响应数据的响应JSON数据，看起来像在阿贾克斯它不是成功 –

添加错误处理程序来获取错误信息 – JYoThI

。

更改对循环这样

for(var key in data){ 
     options += "<option value='" + key + "'>" + data[key] + "</option>"; 
}

因此，JS会像

$("#category").click(function(){ 

    $.ajax({ 
     type: "POST", 
     url: "loadSelectBox", 
     dataType: 'json', 
     success: function(data){ 
      $("#category").empty(); 
      var options = ''; 
      for(var key in data){ 
       options += "<option value='" + key + "'>" + data[key] + "</option>"; 
      } 
      $("#category").append(options); 
      $("#category").trigger('chosen:updated'); 
     }, 
     error: function(response){ 
      alert("ERROR\n"+response); 
      console.log(response); 
     }, 
    }); 
}) ;

注意：唐未用空间分隔键发送JSON。

在你要跟样本响应“DATA 5类型”这些都不是有效的JSON keys.Either用下划线（“TYPE_OF_DATA_5”）分离，或使用“驼峰”符号用于参考键

来源

2017-07-27 04:35:47

我已经按照上面所说的完成了，但仍然收到404错误，并且选择框未加载 –

检查您的回复。 404是页面未找到error.Which由server.add抛出一个错误块来显示响应。 –

尽管我没有得到预期的结果 –

第一：return catJsonObj;不会返回json string至ajax。你需要返回浏览器输出像System.out.println(catJsonObj);

return catJsonObj;

变化

System.out.println(catJsonObj);

注：还删除不需要的System.out.println(..);

第二：按照@Aneesh RS步骤poppulate下拉

来源

2017-07-27 04:45:49 JYoThI

我找到了解决方案，因为它是服务器端ISE，我刚在我的控制器类中添加了@ResponseBody。

@PostMapping(name="loadSelectBox") 
    @ResponseBody 
    public JSONObject getCategoryJsonObj() throws Exception{ 
// Logics 
}

来源

2017-07-27 06:00:12

如何使用jquery和ajax调用从JsonObject获取值？

回答

相关问题