| Using AJAX To Update Data On A Web Page |
|
|
|
| Written by David Hollingworth | |
| Thursday, 19 July 2007 | |
|
Page 3 of 5 The XML FileInstead of our AWS software generating a new HTML document and ftping it to our web server we're going to get it to generate an XML file and send that instead. The XML file is of the format: <?xml version="1.0" encoding="utf-8"?> .... Some data tags go in here </currentconditions>
The first line is essential information for the browser, from there on you can call your tags anything at all except that the data tags must be enclosed in 'root' tags. Here I've called the root tags 'currentconditions'; but you can call them anything. Just ensure the opening and closing tag names are exactly the same. The data tags that go between the root tags can also be called anything. However for the Javascript I've written to work properly my data tags must match my HTML span IDs. For example I've got a span for my current temperature whose ID is "curtemp". Therefore the XML tag that will take my current temperature must also be called curtemp. If the XML tag names don't match the HTML span IDs then nothing is going to work. I could have programmed it so you can have different XML tag names and span IDs; but that would have been a lot more work in the Javascript. In case you haven't guessed it the XML data tags will contain the AWS data tags. For example here's the data tag for the current temperature: <curtemp>^vxv007^</curtemp> And here's the complete XML file: <?xml version="1.0" encoding="utf-8"?> <currentconditions> <curtime>^vst143^</curtime> <curdate>^vst142^</curdate> <curtemp>^vxv007^</curtemp> <maxtemp>^vhi007^</maxtemp> <maxtempt>^vht007^</maxtempt> <mintemp>^vlo007^</mintemp> <mintempt>^vlt007^</mintempt> <avgtemp>^vda007^</avgtemp> <curdp>^vxv022^</curdp> <maxdp>^vhi022^</maxdp> <maxdpt>^vht022^</maxdpt> <mindp>^vlo022^</mindp> <mindpt>^vlt022^</mindpt> <avgdp>^vda022^</avgdp> <currh>^vxv005^</currh> <maxrh>^vhi005^</maxrh> <maxrht>^vht005^</maxrht> <minrh>^vlo005^</minrh> <minrht>^vlt005^</minrht> <avgrh>^vda005^</avgrh> <curws>^vxv002^</curws> <maxws>^vhi002^</maxws> <maxwst>^vht002^</maxwst> <minws>^vlo002^</minws> <minwst>^vlt002^</minwst> <avgws>^vda002^</avgws> <winddir>^vxv001^</winddir> <bft>^vst141^</bft> <curwg>^vxv003^</curwg> <maxwg>^vhi003^</maxwg> <maxwgt>^vht003^</maxwgt> <minwg>^vlo003^</minwg> <minwgt>^vlt003^</minwgt> <avgwg>^vda003^</avgwg> <curwc>^vxv019^</curwc> <maxwc>^vhi019^</maxwc> <maxwct>^vht019^</maxwct> <minwc>^vlo019^</minwc> <minwct>^vlt019^</minwct> <avgwc>^vda019^</avgwc> <curmb>^vxv008^</curmb> <maxmb>^vhi008^</maxmb> <maxmbt>^vht008^</maxmbt> <minmb>^vlo008^</minmb> <minmbt>^vlt008^</minmbt> <avgmb>^vda008^</avgmb> <barotrend>^vst140^</barotrend> <raintoday>^vxv121^</raintoday> <rainhour>^vxv122^</rainhour> <rain24hh>^vxv123^</rain24hh> </currentconditions> You'll notice that some of the XML tags are short names, like "avgwc". This is really to save me typing time and so long as I've a span with an id="avgwc" all will be well. When your AWS software processes the XML file it will replace all the AWS tags with real data so that <curtemp>^vxv007^</curtemp> becomes <curtemp>16.9</curtemp> Finally you'll need to reconfigure your AWS software to ftp the XML file up to the web server instead of the HTML file you were transfering before. Having done this we'll need a small script to server up the XML file when it's requested. |
|
| Last Updated ( Thursday, 19 July 2007 ) |


