0

I want to retrive data froma php page using json calling and display it in listview using jquery mobile. I am able to retrive the data and also able to display in list but problem i am facing is that : my data lokks like this in php file: ([{"id":"1","name":"Big Ben","latitude":"51.500600000000","longitude":"-0.124610000000"},{"id":"4","name":"Hadrian's Wall","latitude":"55.024453000000","longitude":"2.142310000000"},{"id":"2","name":"Stonehenge","latitude":"51.178850000000","longitude":"-1.826446000000"},{"id":"3","name":"White Cliffs of Dover","latitude":"51.132020000000","longitude":"1.334070000000"}]);

when I am displaying it in list it's showing in one row of list only. How can I disply the datas in separate row with respect to their "id" ?

4

2 に答える 2

0
var i;

for(i = 0; i < data.length; i+=1) {
    // do whatever here, the id is in data[i].id
    console.log(data[i].id);
}

jQueryモバイルを使用していると述べたので、おそらくリストビューに要素を追加するでしょう。<li>その場合.append<ul data-role=listview>.

編集:コメントに従って、各関数を次のように変更します。

$.each(data, function(i, item) {
     $('ul').append('<li><h1>' + item.name + '</h1><p>' + item.latitude + '<br>' + item.longitude + '</p></li>');
});

そして<li><a id="output"> </a></li>、HTML コードから を削除します。

ただし、ページに複数の要素がある場合は機能しないため、正しい要素に<ul>を設定することをお勧めします。id<ul>

于 2012-11-22T08:43:37.737 に答える
0
$(document).ready(function(){
$(document).bind('deviceready', function(){
    //Phonegap ready
    onDeviceReady();
});

var output = $('#output');

$.ajax({
    url: 'http://samcroft.co.uk/demos/updated-load-data-into-phonegap/landmarks.php',
    dataType: 'jsonp',
    jsonp: 'jsoncallback',
    timeout: 5000,
    success: function(data, status){
        $.each(data, function(i,item){ 
            var landmark = '<h1>'+item.name+'</h1>'
            + '<p>'+item.latitude+'<br>'
            + item.longitude+'</p>';

            output.append(landmark);
        });
    },
    error: function(){
       output.text('There was an error loading the data.');
    }
});

});

于 2012-11-22T08:47:40.030 に答える