Thay đổi nội dung của div trong Jquery Mobile

Trước tiên, bạn sẽ muốn đảm bảo rằng php của bạn trả về một JSON được định dạng đúng, trong trường hợp này sẽ là một mảng các đối tượng {id:1, name:"Name"}. Bạn có thể xem qua cái này trang ví dụ. Bạn sẽ nhận được một cái gì đó giống như

$fetch = mysql_query("SELECT * from railway"); 

while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) {
  $row_array['id'] = $row['id'];
  $row_array['name'] = $row['name'];

  array_push($return_arr,$row_array);
}

echo json_encode($return_arr);

Về phía khách hàng, nếu bạn muốn hưởng lợi từ jquery mobile listviews , bạn có thể nên thay đổi <div data-role="content" id="list"> tới <ul data-role="listview" id="list"> .

Sau đó, bạn nên nghĩ đến việc chuyển mã js của mình vào tiêu đề và liên kết nó với một pageinit sự kiện.

Bạn cũng sẽ cần sửa đổi hàm thành công của mình để lặp qua mảng và thêm các phần tử vào danh sách của mình.

$(document).live('pageinit',function (event) {
    $.ajax({
        url: 'index.php',
        data:"",
        dataType: 'json',
        success: function(data)        
          {
            for (var i = 0; i < data.length; i++) {
              $('#list').append("<li><b>id: </b>"+ data[i].id +"<b> name: </b>"+ data[i].name + "</li>"); 
            }
         }
    });
}); 

Sau đó, bạn có thể cần phải làm mới listview bằng $('#mylist').listview('refresh'); để cung cấp cho nó định dạng jquery di động thích hợp