I'm making a web using PhoneGap. I need to use a PHP page, but I want a real fluid website, so I opted for replacing a div with some PHP using JavaScript when loaded.
When I launch the page "mypage.html" I check the user connection with this function:
<script>
function checkConnection(){
var online, speed;
/*
condizione di controllo per determinare se l'app viene correntemente testata
in un simulatore o dispositivo mobile (quindi utilizzando PhoneGap) o in un normale browser
che supporta l'HTML5
*/
if(typeof cordova != "undefined"){
/*
si tratta di un dispositivo vero e proprio o di un simulatore, quindi
utilizziamo il plugin "Connection" messo a disposizione da Phonegap
*/
var networkState = navigator.connection.type;
var states = {};
states[Connection.UNKNOWN] = 'Unknown';
states[Connection.ETHERNET] = 'Ethernet';
states[Connection.WIFI] = 'WiFi';
states[Connection.CELL_2G] = 'Cell_2G';
states[Connection.CELL_3G] = 'Cell_3G';
states[Connection.CELL_4G] = 'Cell_4G';
states[Connection.CELL] = 'Cell_generic';
states[Connection.NONE] = 'None';
//determino il tipo di connessione in base all'oggetto "states" appena definito grazie al plugin Phonegap
var connType = states[networkState];
if(connType=='None')
online = false;
else{
online = true;
if(connType=="Cell_2g" || connType=="Cell_generic")
speed="slow";
else
speed="fast";
}
}else{
/*
si tratta di un normale browser desktop o mobile, quindi
utilizziamo la funzionalità HTML5
*/
online = navigator.onLine;
if(online){
var conn = navigator.connection || {'bandwidth':'0'};
//utilizziamo il metodo "bandwidth" per determinare la velocità di connessione, il quale restituisce un valore numerico che indica la larghezza di banda della connessione corrente
if(conn.bandwidth>2)
speed="fast";
else
speed="slow";
}
}
return online?speed:false;
}
var deviceConnection = checkConnection();
if(deviceConnection){
if(deviceConnection == "slow"){
//gestione connnessione lenta
}else{
//gestione connnessione veloce
}
}else{
/*
gestione transizioni ed effetti per mostrare all'utente
un gradevole avviso di mancanza di connessione
*/
location.href="errorconnection.html";
}
</script>
This is the AJAX code :
<div id="container">
<script>
$( "#container" ).load("http://www.mywebsite.org/FOLDER/page.php #container");
</script>
</div>
When I launch "mypage.html" on my browser locally it works ok, except for that it shows for a bit of php code. When I launch "mypage.html" on PhoneGap it shows me only a part of the php code and nothing else.
...
</head>
<body style="background-color:#e20a7e">
<div id="navigation">
<table width="100%">
<tr valign="bottom">
<td valign="middle" width="25%" align="center">
</td>
<td valign="bottom" width="50%" align="center">
<img src="IMG/LOGO-WHITE.png" class="logonbar" alt="DONUT"/>
</td>
<td onClick="window.location='loginpage.php'" width="25%" align="center" valign="middle">
<img src="IMG/icon/usr.png" class="icons3"/>
</td>
</tr>
</table>
</div>
<div id="container">
<?php
$DBhost = "localhost";
$DBuser = "xx";
$DBpass = "";
$DBName = "xx";
$table = "Database";
mysql_connect($DBhost,$DBuser,$DBpass) or die("mysql_error()");
@mysql_select_db("$DBName") or die("mysql_error()");
$sqlquery = "SELECT * FROM `Database` ORDER BY data DESC";
$result = mysql_query($sqlquery);
$number = mysql_num_rows($result);
$i = 0;
while ($i < $number) {
$festa[$i] = mysql_result($result,$i,"festa");
$luogo[$i] = mysql_result($result,$i,"luogo");
$idfesta[$i] = mysql_result($result,$i,"ID");
$data[$i] = mysql_result($result,$i,"data");
$nomeimg[$i] = mysql_result($result,$i,"nomeimg");
$data[$i] = data_eng_to_it_($data[$i]);
echo"
<!--INIZIO DIV EVENTO-->
<a href="pagevento.html?ID=$idfesta[$i]">
<div style="width:90%; display:block; margin:0 auto;
padding-top:10px; margin-top:10px; padding-left:10px;
background-color:#FFF; padding-bottom:10px;
border-left:solid 5px #e20a7e;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.7);">
<table width="100%" style='table-layout:fixed'>
<tr valign="middle">
<td valign="middle" align="center" class="evntfoto"
style="background-image:url(foto/$nomeimg[$i]);
background-position:center;
background-size: cover;">
</td>
<td valign="top" align="left" id="evnttxt">
<font color="#0066FF" size="+2"> <b> ".$festa[$i]." </b></font> <br>
".$data[$i]." <br>
<font color="#585858"> ".$luogo[$i]." </font> <br>
</td>
</tr>
</table>
</div>
</a>
<!--FINE DIV EVENTO-->
";
$i++;
}
?>
</div>
</div>
</body>
</html>
and when I run the page it shows me:
".$festa[$i]."
".$data[$i]."
".$luogo[$i]."
"; $i++; ?>
but only from PhoneGap. In other browsers, Safari on Mac, Google Chrome on Mac and Safari on iPhone it works correctly, and shows me that code for only a second. What could be the problem?
See Question&Answers more detail:os
