Hola a todos...
Incursionando en el mundo de las aplicaciones moviles compilaas con Phonegap me encuentro con un escollo dificil de sortear...
Estoy tratando de levantar informacion de un servidor web (php+mysql) a traves de ajax...
Utilizo un ejemplo practico que luego, si funciona, trabajare en la adaptacion del mismo para mostrar los datos requeridos. De momento, trabajo con el ejemplo que detallo a continuacion, para aprender la manera de conectar.
La aplicacion es simple... y consta de solo 3 archivos en la app y uno en el servidor remoto.
Lado App (Movil)
index.html
Código:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.jsonp-2.2.0.min.js" type="text/javascript"></script>
<script src="js/load-json.js"></script>
</head>
<body>
<div id="output"></div>
</body>
</html>
js/jquery-1.7.2.min (No necesita descripcion no?)
ajax.js
Código:
$(document).ready(function(){
$(document).bind('deviceready', function(){
//Phonegap ready
onDeviceReady();
});
var output = $('#output');
$.ajax({
url: 'http://www.nombredemiweb.com.ar/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(err, textStatus, errorThrown) {
output.text("There was an error [" + textStatus + "] loading the data.");
console.log(err);
console.log(errorThrown);
}
});
});
Lado Servidor: landmarks.php Código PHP:
<?php
header('Content-type: application/json');
$server = "localhost";
$username = "usuario";
$password = "clave";
$database = "database";
$con = mysql_connect($server, $username, $password) or die ("Could not connect: " . mysql_error());
mysql_select_db($database, $con);
$sql = "SELECT id, l_name AS name, l_lat AS latitude, l_long AS longitude FROM landmarks ORDER BY l_name";
$result = mysql_query($sql) or die ("Query error: " . mysql_error());
$records = array();
while($row = mysql_fetch_assoc($result)) {
$records[] = $row;
}
mysql_close($con);
echo $_GET['jsoncallback'] . '(' . json_encode($records) . ');';
?>
El problema que encuentro es el siguiente. Al ejecutarlo en modo web digamos (llamando al index.html, tanto en localhost como en algun dominio, funciona perfecto, buscando la info en mysql, y mostrandola en el html, tal como se requiere. El problema, es que al ejecutarla en la aplicacion compilada (Instalada en Blackberry) sale el error There was an error [timeout] loading the data.
Alguien ha tenido el mismo problema? Podria orientarme hacia donde debo mirar para solucionarlo? (version de jQuery, version de PHP, codigo, permisos, etc)
Aclaro que el servidor existe, y si ejecuto directamente el php remoto obtengo:
Código:
([{"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"}]);
Desde ya, agradecere cualquier orientacion que me puedan dar.
Saludos desde Argentina.