I’m updating some fields on my webpage with dynamic content using javascript. It works perfect with all PC browsers (I tested with Firefox, IE and Chrome) but doesn’t work on Android phones and iPhone. The phone displays the static content but doesn’t show the values written by javascript.
could it be related to the format of the reply message for HTTP GET? I haven’t included an HTTP header in the reply message, just raw data.
My js code is below:
function get_datetime() {
var GetReq = false;
var hourText = document.getElementById("hour");
var minuteText = document.getElementById("minute");
var dayText = document.getElementById("day");
var monthText = document.getElementById("month");
var yearText = document.getElementById("year");
function GetValComplete() {
if (GetReq.readyState == 4) {
if (GetReq.status == 200) {
var time = GetReq.responseText.split(";");
hourText.value = time[0];
minuteText.value = time[1];
dayText.value = time[2];
monthText.value = time[3];
yearText.value = time[4];
}
}
}
if (window.XMLHttpRequest) {
GetReq = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
GetReq = new ActiveXObject("Microsoft.XMLHTTP");
}
if (GetReq) {
GetReq.open("GET", "/datetime?id=" + Math.random(), true);
GetReq.onreadystatechange = GetValComplete;
GetReq.send(null);
return true;
}
return false;
}
my html code is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-9" />
<title>date-time</title>
<script type="text/javascript" src="datetime.js"></script>
<style type="text/css">
.auto-style3 {
border: 1px solid #000000;
width: 100px;
}
</style>
</head>
<body onload="get_datetime();">
<br />
<h2><strong>date-time settings:</strong></h2>
<h2><strong></strong></h2>
<br />
<form id="form5" name="form5" method="post" action="">
<p><label for="hour">Hour</label>
<input name="hour" id="hour" class="auto-style3" type="text" /><label for="minute">Minute</label>
<input name="minute" id="minute" class="auto-style3" type="text" /></p>
</form>
<br />
<form id="form6" name="form6" method="post" action="">
<label for="day">Day</label>
<input name="day" class="auto-style3" id="day" type="text" /><label for="month">Month</label>
<input name="month" class="auto-style3" id="month" type="text" /><label for="year">Year</label>
<input name="year" class="auto-style3" id="year" type="text" /></form>
<br />
</body></html>
it was the missing HTTP header. The HTTP responses which carry the dynamic content haven’t had any HTTP header. Now I added the header manually (I had to add it manually because it is a custom-made system) and it worked.
The missing header doesn’t matter on PC browsers, but apparently isn’t accepted by Android / iOS.