[英]Parse JSON and extend a listview with the data in jQuery mobile
我想從服務器中獲取一些數據並追加一個jQuery-Listview,這是行不通的。 測試Chrome控制台時出現此錯誤:
未捕獲的SyntaxError:意外的令牌i
我用來消耗來自服務器的Json字符串的代碼:
$.ajax({
url: 'http://domain/GetArknr'
})
.done(function(data) {
$.each(JSON.parse(data), function(idx, obj) {
$('#listview').append('<li id="' + obj.ARKNR + '"><a href="#">' + obj.ARKNR + '</a></li>');
})
$('#listview').listview('refresh');
alert(data)
})
.fail(function() {
alert("Failed to fetch data");
})
和JSON:
[ { "arknr" : "0582",
"id" : "0582"
},
{ "arknr" : "0590",
"id" : "0590"
},
{ "arknr" : "0599",
"id" : "0599"
},
{ "arknr" : "1001",
"id" : "1001"
},
{ "arknr" : "1002",
"id" : "1002"
},
{ "arknr" : "1003",
"id" : "1003"
},
{ "arknr" : "1004",
"id" : "1004"
},
{ "arknr" : "1005",
"id" : "1005"
},
{ "arknr" : "1006",
"id" : "1006"
},
{ "arknr" : "1007",
"id" : "1007"
},
{ "arknr" : "1008",
"id" : "1008"
},
{ "arknr" : "1009",
"id" : "1009"
},
{ "arknr" : "1010",
"id" : "1010"
},
{ "arknr" : "1011",
"id" : "1011"
},
{ "arknr" : "1012",
"id" : "1012"
},
{ "arknr" : "1013",
"id" : "1013"
},
{ "arknr" : "1014",
"id" : "1014"
},
{ "arknr" : "1016",
"id" : "1016"
},
{ "arknr" : "1017",
"id" : "1017"
},
{ "arknr" : "1018",
"id" : "1018"
},
{ "arknr" : "1019",
"id" : "1019"
},
{ "arknr" : "1020",
"id" : "1020"
},
{ "arknr" : "1021",
"id" : "1021"
},
{ "arknr" : "1022",
"id" : "1022"
},
{ "arknr" : "1023",
"id" : "1023"
},
{ "arknr" : "1024",
"id" : "1024"
},
{ "arknr" : "1025",
"id" : "1025"
},
{ "arknr" : "1026",
"id" : "1026"
},
{ "arknr" : "1027",
"id" : "1027"
},
{ "arknr" : "1029",
"id" : "1029"
},
{ "arknr" : "1030",
"id" : "1030"
},
{ "arknr" : "1031",
"id" : "1031"
},
{ "arknr" : "1032",
"id" : "1032"
},
{ "arknr" : "1033",
"id" : "1033"
},
{ "arknr" : "1035",
"id" : "1035"
},
{ "arknr" : "1036",
"id" : "1036"
},
{ "arknr" : "1037",
"id" : "1037"
},
{ "arknr" : "1038",
"id" : "1038"
},
{ "arknr" : "1040",
"id" : "1040"
},
{ "arknr" : "1041",
"id" : "1041"
},
{ "arknr" : "1042",
"id" : "1042"
},
{ "arknr" : "1043",
"id" : "1043"
},
{ "arknr" : "1044",
"id" : "1044"
},
{ "arknr" : "1046",
"id" : "1046"
},
{ "arknr" : "1047",
"id" : "1047"
},
{ "arknr" : "1048",
"id" : "1048"
},
{ "arknr" : "1049",
"id" : "1049"
},
{ "arknr" : "1050",
"id" : "1050"
}
]
在服務器端,我正在使用Spring 4.1.2。 響應在Chrome中以'xhr'列出-我不知道如何將響應聲明為application/json
,我嘗試對處理請求/GetArknr
的方法使用幾種不同的注釋:
@RequestMapping(value = "/GetArknr")
public ModelAndView getArknr() {
HashMap <String, Object> model = new HashMap();
List <Map<String, Object>> data = dataProvider.getArkNr();
model.put("table", data);
return new ModelAndView("json/arknrListJson", model);
}
通常,在Spring REST服務中,您不需要視圖,而是希望使用@ResponseBody並將生成的類型指定為“ application / json”
@RequestMapping(value = "/GetArknr", produces = "application/json")
@ResponseBody
public List<Map<String, Object>> getArknr() {
HashMap <String, Object> model = new HashMap();
List <Map<String, Object>> data = dataProvider.getArkNr();
return data;
}
然后在ajax調用中,您可以執行以下操作:
$.ajax({
cache : false,
type : 'GET',
url: 'http://domain/GetArknr',
dataType : 'json',
success : function(data) {
if (data == null) {
//error handling
}
$.each(data['something'], function(idx, obj) {
$('#listview').append('<li id="' + obj.ARKNR + '"><a href="#">' + obj.ARKNR + '</a></li>');
})
}
}
您也可以在$ .ajax調用中使用此請求以請求正確的數據格式(將Accept標頭設置為“ application / json”) 將Accept標頭添加到JQuery AJAX GET(通過JSONP)請求中
jQuery通過智能方式選擇.ajax數據變量類型,很有可能您不需要將數據解析為json,因為它已經是一個JavaScript對象。 您能告訴我們在function(data){之后顯示什么console.log(data)嗎?
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.