在我的应用程序中,我有三页首页显示标记类型listview
(商场,超市等),第二页显示标记listview
属于同一类型,第三页显示详细信息每个标记。
我已成功显示类型页面,但未显示相同type_ID的listview
个标记!!
(DB中的地标表)
**L_ID , name , image, Type_ID**
|1 , B_mall , .jpg , 1|
|2 , c_mall , .jpg , 1|
|3 , D_supermarket , .jpg , 2|
php文件查询
<?php
$dbhost = '127.0.0.1';
$dbuser = 'root';
$dbpass = '';
$dbname = 'maalem';
$sql = "SELECT * FROM landmarks where Type_ID=:id";
try {
$con = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpass);
$con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$con->query('SET NAMES utf8');
$stmt = $con->prepare($sql);
$stmt->bindParam("id", $_GET["Type_ID"]);
$stmt->execute();
$markers = $stmt->fetchAll(PDO::FETCH_OBJ);
$con = null;
echo '{"items":'. json_encode($markers) .'}';
} catch(PDOException $e) {
echo '{"error":{"text":'. $e->getMessage() .'}}';
}
?>
输入js文件
var serviceURL = "http://localhost/map/"; //192.168.1.157
var type;
$('#typeListPage').bind('pageinit', function(event) {
gettypeList();
});
function gettypeList() {
$.getJSON(serviceURL + 'gettype.php', function(data) {
$('#typeList li').remove();
type = data.type;
$.each(type, function(index, type) {
$('#typeList').append('<li><a href="marker.html?Type_ID=' + type.Type_ID + '">' +
'<img src="' + type.Icon + '"/>' +
'<h4>' + type.type_title + '</h4></a></li>');
});
$('#typeList').listview('refresh');
});
}
标记js文件
var serviceURL = "http://localhost/map/";
var markers;
$('#markerListPage').bind('pageinit', function(event) {
getmarkerList();
});
function getmarkerList() {
$.getJSON(serviceURL + 'getmarkers.php', function(data) {
$('#markerList li').remove();
markers = data.items;
$.each(markers, function(index, landmarks) {
$('#markerList').append('<li><a href="markerdetail.html?L_ID=' + landmarks.L_ID + '">' +
'<img src="pics/' + landmarks.Image + '"/>' +
'<h4>' + landmarks.Title + '</h4></a></li>');
});
$('#markerList').listview('refresh');
});
}
marker.Html文件
<!DOCTYPE HTML>
<html>
<header>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
</header>
<body>
<div id="markerListPage" data-role="page" >
<div data-role="header" >
<h1>markers</h1>
<a href="index.html" data-rel="back" class="ui-btn-left ui-btn ui-btn-icon-notext ui-corner-all ui-icon-back"></a>
</div>
<div data-role="content">
<ul id="markerList" data-role="listview" data-filter="true"></ul>
</div>
</div>
</body>
</html>
答案 0 :(得分:1)
var serviceURL = "http://localhost/map/";
var markers;
$('#markerListPage').live('pageshow', function(event) {
var id = getUrlVars()["Type_ID"];
$.getJSON(serviceURL + 'getmarkers.php?Type_ID=' + id, getmarkerList);
});
function getmarkerList(data) {
$('#markerList li').remove();
markers = data.items;
$.each(markers, function(index, landmarks) {
$('#markerList').append('<li><a href="markerdetail.html?L_ID=' + landmarks.L_ID + '">' +
'<img src="pics/' + landmarks.Image + '"/>' +
'<h4>' + landmarks.Title + '</h4></a></li>');
});
$('#markerList').listview('refresh');
}