Befüllen von jQuery Mobile ListView mit lokalen JSON-Daten
Ich versuche, eine JQM-ListView mit lokalen JSON-Informationen zu füllen. Es werden jedoch keine Listenelemente erstellt. Jede Hilfe wäre dankbar. Hier ist mein Code:
JSON-Dateistruktur:
[
{
"name" : "test"
"calories" : "1000"
"fat" : "100"
"protein" : "100"
"carbohydrates" : "800"
},
{
"name" : "test2"
"calories" : "10000"
"fat" : "343"
"protein" : "3434"
"carbohydrates" : "4343"
}
]
HTML:
<div data-role="page" data-title="Search" id="searchPage">
<ul data-role="listview" data-inset="true" id="searchFood">
</ul>
</div>
JS:
(Aktualisiert)
$(document).on("pageinit", "#searchPage", function(){
$.getJSON("../JS/food.json", function(data){
var output = '';
$.each(data, function(index, value){
output += '<li><a href="#">' +data.name+ '</a></li>';
});
$('#searchFood').html(output).listview("refresh");
});
});