Jump to content
Larry Ullman's Book Forums

Ajax - Xmlhttprequest


Recommended Posts

I'm trying to insert some weather data from on online service to a web page using xmlhttprequest to get the data and a php script to output the data. The php script, below, works fine as I've tested it on a static xml file

<?php
include 'weather.php';
$data= new SimpleXMLElement($xmlstr);
echo '<table id="forecast"><tr>';
foreach ($data->weather as $weather) {
$date = (string) $weather->date;
$iconUrl = (string) $weather->weatherIconUrl;
$maxF = (int) $weather->tempMaxF;
$minF = (int) $weather->tempMinF;
$desc = (string) $weather->weatherDesc;
echo '<td><ul id="daily"><li class="desc">'. date('D', strtotime($date)) . '</li>
<li><img src="' . $iconUrl . '" alt="weather icon" height="30" width="30"</li>
<li class="temp">' . $maxF . '&deg/' . $minF . '&deg</li>
</ul></td>';
}
echo '</tr></table>';
?>

but I'm struggling to understand how to get the data from the xmlhttprequest to the php script. I've tried to code an xmlhttprequest but need some help. If I used the script below, how does the php script access the returned data which is sent as an xml file? Thanks.

request.onreadystatechange = function() {
if request.readyState == 4 && request.status == 200{
 return true;
}
}
if (window.XMLHttpRequest)
request=new XMLHttpRequest();
else request=new ActiveXObject("Microsoft.XMLHTTP");  // code for IE 6 or before.
request.onreadystatechange;
request.open("GET","forecast.php",true);
request.send();		   // Send "Get" request to specified PHP script.
}

Link to comment
Share on other sites

Well which is the php script that will receive the GET data forecast.php?

 

The values passed after the .php will be part of the GET so you can extract through values individually from the $_GET array if you know what they are. The extraction takes place on your forecast.php, the script where the variables were passed to. You could process that xmlhttprequest and if the values are sent to forecast.php, see what values come in the URL if you are unsure of what they are.

  • Upvote 1
Link to comment
Share on other sites

I've badly misunderstood how ajax works and realise that my xmlhttprequest needs to be done in a way that allows me to get data that originates from a different server. The xmlhttprequest should be to

 request.open("GET","http://free.worldweatheronline.com/feed/weather.ashx",true);

then I need to access the returned file

request.responseXML

and make it available to forecast.php, which I'm not sure how to do. I'm also not sure how to initiate the xmlhttprequest. Clearly I'm out of my depth here - any light you can shed or pointers to resources would be great.

Link to comment
Share on other sites

I've been using that site to get the weather information I need. My questions are 1. how do I code the xmlhttprequest to get round the cross server issue and 2. how do I grab hold of the xml data it returns and pass it to my php script which processes it?

Link to comment
Share on other sites

You can't go across servers via Ajax unless you use JSON-P, if that's an option. An alternative is to use a PHP script on your server that fetches the data from the other server using cURL. Then you make a request of your PHP script.

  • Upvote 1
Link to comment
Share on other sites

I've been using that site to get the weather information I need. My questions are 1. how do I code the xmlhttprequest to get round the cross server issue and 2. how do I grab hold of the xml data it returns and pass it to my php script which processes it?

 

Back last year when I first learned basic php, mysql and JavaScript there was an exercise in the book where we had to extract XML data from the yahoo news website page I think it was an rss feed. I had a look at your weather site but you can only get a trial period, but what I am wondering is where do you need to have the weather forecast for exactly?

Link to comment
Share on other sites

I looked in Larry's PHP advanced book (chapter 9) to learn about cURL and saw that he was achieving what I wanted using fopen. I ended up using file_get_contents which has worked. Here's the final code.


<?php 
$weather = file_get_contents("http://free.worldweatheronline.com/feed/weather.ashx?q=10022&format=xml&num_of_days=5");
$data = new SimpleXmlElement($weather);

echo '<table id="forecast"><tr>';
foreach ($data->weather as $weather) {
$date = (string) $weather->date;
$iconUrl = (string) $weather->weatherIconUrl;
$maxF = (int) $weather->tempMaxF;
$minF = (int) $weather->tempMinF;
$desc = (string) $weather->weatherDesc;

echo '<td><ul id="daily"><li class="desc">'. date('D', strtotime($date)) . '</li>
<li><img src="' . $iconUrl . '" alt="weather icon" height="30" width="30"</li>
<li class="temp">' . $maxF . '&deg/' . $minF . '&deg</li>
</ul></td>';
}
echo '</tr></table>';
echo '</body></html>';
foreach ($data->weather as $weather) {
$date = (string) $weather->date;
$iconUrl = (string) $weather->weatherIconUrl;
$maxF = (int) $weather->tempMaxF;
$minF = (int) $weather->tempMinF;
$desc = (string) $weather->weatherDesc;

echo '<td><ul id="daily"><li class="desc">'. date('D', strtotime($date)) . '</li>
<li><img src="' . $iconUrl . '" alt="weather icon" height="30" width="30"</li>
<li class="temp">' . $maxF . '&deg/' . $minF . '&deg</li>
</ul></td>';
}
echo '</tr></table>';

You need to apply for an api key to use the online weather service and include it in the URL.

 

Is there a reason that cURL would work better than this method?

 

@Larry - I think your books are excellent, I learned so much from PHP and MYSQL for Dynamic Web Sites that I bought Advanced PHP. Thanks.

  • Upvote 1
Link to comment
Share on other sites

Excellent. Kudos for figuring it out and thanks for posting your solution. cURL isn't better here, in fact it's more complicated, but some servers don't allow fopen() for a URL.

 

Thanks for the nice words on the books! Much appreciated.

  • Upvote 1
Link to comment
Share on other sites

 Share

×
×
  • Create New...