Im trying to get my squery mobile app to show certain data of mysql in a listview mode. It seems to be something wrong as nothing happens when I try it.
Here is my html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Watto</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="../css/app.css" rel="stylesheet" />
<link href="../css/themes/2/watto.min.css" rel="stylesheet" />
<link href="../css/themes/2/jquery.mobile.icons.min.css" rel="stylesheet" />
<link href="../lib/jqm/jquery.mobile.structure-1.4.5.min.css" rel="stylesheet" />
<script src="../js/listaplanesnuevos.js"></script>
<script src="../lib/jquery/jquery-2.1.4.min.js"></script>
<script src="../lib/jqm/jquery.mobile-1.4.5.js"></script>
<script src="../services/getplanes.php"></script>
<link rel="apple-touch-icon" href="../img/apple-touch-icon.png" />
<link rel="apple-touch-icon-precomposed" href="../img/apple-touch-icon.png"/>
</head>
<body>
<!----------PLANES NUEVOS ------------>
<div data-role="page" id="planesnuevos">
<div data-role="header" data-position="fixed">
<h1>Planes Nuevos</h1>
</div> <!----HEADER---->
<div role="main" class="ui-content">
<ul id="listaplanesnuevos" data-role="listview" data-filter="true"></ul>
</div> <!------ CONTENT ----->
<div data-role="footer">
<div data-role="navbar">
<ul>
<li><a href="#planesnuevos" data-icon="home" class="ui-btn-active"></a></li>
<li><a href="#search" data-icon="search"></a></li>
<li><a href="#chooser" data-icon="eye" data-iconpos="right"></a></li>
<li><a href="#location" data-icon="location"></a></li>
<li><a href="../settings" data-icon="gear"></a></li>
</div>
</div>
</body>
</html>
Here is my JavaScript:
var serviceURL = "http://localhost/directory/app/watto/services";
var planes;
$('#planesnuevos').bind('pageinit', function(event) {
getListaPlanes();
});
function getListaPlanes() {
$.getJSON(serviceURL + 'getplanes.php', function(data) {
$('#listaplanesnuevos li').remove();
resplanes = data.items;
$.each(resplanes, function(index, plan) {
$('#listaplanesnuevos').append('<li><a href="detallesplan.html?id=' + plan.folio + '">' +
'img src="pics/' + plan.foto + '"/>' +
'<h4>' + plan.nombre + '</h4>' +
'<p>' + plan.descripcion + '</p></a></li>');
});
$('#listaplanesnuevos').listview('refresh');
});
}
and here is the PHP file
<?PHP
include 'config.php';
$sql = "SELECT `folio`, `nombre`, `descripcion`, `foto` FROM `Planes` GROUP BY `folio` ORDER BY `folio`";
try {
$dbh = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpass);
$dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $dbh->query($sql);
$planes = $stmt->fetchAll(PDO::FETCH_OBJ);
$dbh = null;
echo '{"items":'. json_encode($planes) .'}';
} catch(PDOException $e) {
echo '{"error":{"text":' . $e->getMessage() . '}}';
}
?>
I don't know what is wrong, please help as im new to this.
Thanks!
Aucun commentaire:
Enregistrer un commentaire