Potrzebuje stworzyc porostą stronkę www z wykorzystaniem AJAX ponieważ na stronie mają być wyświetlane zmienne dynamiczne - strona odswieżana co 1500ms.
Nie posiadam żadnego doświadczenia w javascript/css/etc. stąd stąd poniższy kod może zawierać rażące błędy.
Ok- opis sytuacji:
Na strone znajdują się przyciski po przycisnięciu których wysyłane jest zapytanie do serwera metodą GET- to jak przypuszczam będzie działało ok- serwerem jest urzadzenie embedded(mikrokontroler).Przyciski sygnalizują stan diody LED a każde kliknięcie ma spowodować negacje stanu.
Wątpliwości mam natomiast jesli chodzi o odświeżenie statusu przycisków.
Posługuję się plikiem .xml - IOstatuss.xml
jego wnętrze:
-------------IOstatuss.xml-------------
<aa>~led_0~</aa>
---------------------------------------
Zamierzone działanie:
Co 1,5s ma zostać wysołana funkcja RefleshVariables('IOstatuss.xml') po wysłaniu zapytania o zmienne dynamiczne zawarte w pliku .xml, funkcja processResponse() odczytuje informacje zwrotną o stanie zmiennej dynamicznej pliku .xml
Treść całej stronki:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <link rel="shortcut icon" href="./images/logo_icon.ico" /> <link href="style/style.css" rel="stylesheet" type="text/css" /> <!-- ********************** JAVA SCRIPT & AJAX ********************** --> <script type="text/javascript"> //----------------------------------------------------------------------- //1.funkcja tworzy obiekt XMLHttpRequest -w zaleznosci od przegladarki function getXMLHttpRequest() { var request = false; try { request = new XMLHttpRequest(); } catch(err1) { try { request = new ActiveXObject('Msxml2.XMLHTTP'); } catch(err2) { try { request = new ActiveXObject('Microsoft.XMLHTTP'); } catch(err3) { request = false; } } } return request; } var r; r = getXMLHttpRequest(); //2.funkcja informuje server o klikniecu na symbol odpowiedniego IO function changeLED_Statuss(LedAddress) { r.open('GET', LedAddress, true); r.send(null); } //3.funkcja oswieazjaca dane dynamiczne z pliku xlm function RefleshVariables(data) { r.open('GET', data, true); r.onreadystatechange = processResponse; r.send(null); } //4.wywolywana automatycznie po odebraniu danych z xml function processResponse() { if (r.readyState == 4 && r.status == 200) { var x1 = r.responseXML; var x2 = x1.getElementsByTagName('aa'); var x3 = x2[0]; var x4 = x3.childNodes; var x6 = x5.nodeValue; //tutaj powinna byc odpowiedz na zmienna dyn. //r.responseXML.getElementsByTagName('tekst')[0].childNodes[0].nodeValue document.getElementById('diode0').style.color = (x6 == '1') ? '#777' : '#ff8b00'; }; } //----------------------------------------------------------------------- </script> <!-- **************************************************************** --> </head> <body> <div id="display"> </div> <!-- Wywoluj funkcje co 1500ms --> <script type="text/javascript"> setTimeout("RefleshVariables('IOstatuss.xml')",1500); </script> </body> </html>
Byłbym wdzięczny za rzut oka czy takie rozumowanie ma szansę zadziałać.