mam następujący problem. Piszę własnie aplikację AJAXową. W tej chwili - pomijając arkusz stylów - mam 3 pliki: index.php, którego zadaniem jest inicjacja sesji i stworzenie ogólnego szkieletu strony, script.js ze wszystkimi funkcjami js'owymi i ajax.php który reaguje na komunikację ajaxową. Dodam, że ajax.php odbiera dane metodą get i zwraca proste wartości zakodowane metodą xmlrpc - zasadniczo nie ma to znaczenia, ponieważ moim zdaniem błąd tkwi gdzieś w javascriptie.
Sprawa wygląda tak: po załadowaniu się strony index.php następuje odpalenie funkcji init(), która tworzy 3 klikalne elemnty div (odpowiednio id 'loguj', 'sprawdz' i 'wyloguj') przy czym 2 i 3 mają na dzień dobry display: none. Po kliknieciu na loguj tworza sie po prawej stronie 3elementy: input (password), input (login) i button, który po kliknieciu oproznia inputy, wysyla dane do ajax.php i loguje uzytkownika (realizowane poprzez wprowadzenie 2 wartosci do tablicy sesji).
Jednoczesnie, po lewej stronie chowa się element loguj i pojawiaja sie sprawdz i wyloguj.
So far so good.
Problem polega na tym, że guzik "wyloguj" który się powinien właśnie pojawić nie działa, mimo poprawnego przypisania mu atrybutu "onclick".
Dodam, że po przeładowaniu strony w tym punkcie guzik "wyloguj" działa.
Domyślam się, że jest jakiś konflikt między funkcjami ale nie mogę się niczego dopatrzeć.
Dodam jeszcze, że testuję kod pod Operą 9.2 i całkowicie wystarczy, jeżeli będzie działał tylko pod nią.
Poniżej zamieszczam zawartość script.js:
Kod: Zaznacz cały
function createXHR()
{
var aVersions = [ "MSXML2.XMLHttp.5.0","MSXML2.XMLHttp.4.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp","Microsoft.XMLHttp"];
if (typeof XMLHttpRequest != 'undefined')
{
return new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
for (i=0;i<aVersions.length;i++)
{
try
{
var oXmlHttp = new ActiveXObject(aVersion[i]);
return oXmlHttp;
}
catch (oError)
{
}
}
}
throw new Error("sratatata");
}
function init()
{
left = document.getElementById("left_menu");
right = document.getElementById("content");
var req = createXHR();
req.open('GET', 'ajax.php?mode=0', true);
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
if (req.status != 200)
{
alert("wystąpił błąd!");
}
else
{
if (req.getResponseHeader("Content-Type") != "text/xml")
{
alert ("błędny format danych!");
}
else
{
var odpowiedz = req.responseXML;
var root = odpowiedz.documentElement;
level = root.getElementsByTagName("int")[0].textContent;
if (level == 0)
{
link_loguj = document.createElement("div");
link_loguj.textContent = "Zaloguj się";
link_loguj.setAttribute("id","loguj");
link_loguj.setAttribute("onclick","javascript:zaloguj()");
left.appendChild(link_loguj);
link_sprawdz = document.createElement("div");
link_sprawdz.textContent = "Sprawdź się";
link_sprawdz.setAttribute("id","sprawdz");
link_sprawdz.setAttribute("onclick","javascript:sprawdz()");
link_sprawdz.style = "display: none;";
left.appendChild(link_sprawdz);
link_wyloguj = document.createElement("div");
link_wyloguj.textContent = "Wyloguj się";
link_wyloguj.setAttribute("id","wyloguj");
link_wyloguj.setAttribute("onclick","javascript:wyloguj()");
link_wyloguj.style = "display: none;";
left.appendChild(link_wyloguj);
}
else
{
link_loguj = document.createElement("div");
link_loguj.textContent = "Zaloguj się";
link_loguj.setAttribute("id","loguj");
link_loguj.setAttribute("onclick","javascript:zaloguj()");
link_loguj.style = "display: none;";
left.appendChild(link_loguj);
link_sprawdz = document.createElement("div");
link_sprawdz.textContent = "Sprawdź się";
link_sprawdz.setAttribute("id","sprawdz");
link_sprawdz.setAttribute("onclick","javascript:sprawdz()");
left.appendChild(link_sprawdz);
link_wyloguj = document.createElement("div");
link_wyloguj.textContent = "Wyloguj się";
link_wyloguj.setAttribute("id","wyloguj");
link_wyloguj.setAttribute("onclick","javascript:wyloguj()");
left.appendChild(link_wyloguj);
}
}
}
}
}
req.send(null);
}
function wyloguj()
{
var req = createXHR();
req.open('GET', 'ajax.php?mode=9', true);
alert (1);
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
if (req.status != 200)
{
alert("wystąpił błąd!");
}
else
{
if (req.getResponseHeader("Content-Type") != "text/xml")
{
alert ("błędny format danych!");
}
else
{
alert (2);
var odpowiedz = req.responseXML;
var root = odpowiedz.documentElement;
level = root.getElementsByTagName("int")[0].textContent;
if (level == 1)
{
link_loguj = document.getElementById("loguj");
link_sprawdz = document.getElementById("sprawdz");
link_wyloguj = document.getElementById("wyloguj");
prawy = document.getElementById("content");
lista = prawy.childNodes;
j = lista.length;
while (prawy.firstChild)
{
pom = prawy.removeChild(prawy.firstChild);
delete pom;
}
link_loguj.style = "display: block;";
link_sprawdz.style = "display: none;";
link_wyloguj.style = "display: none;";
}
else
{
}
}
}
}
}
req.send(null);
}
function zaloguj()
{
prawy = document.getElementById("content");
if (prawy.childNodes.length <= 1)
{
login = document.createElement("input");
login.setAttribute("type","text");
login.setAttribute("id","login");
prawy.appendChild(login);
br = document.createElement("br");
prawy.appendChild(br);
password = document.createElement("input");
password.setAttribute("type","password");
password.setAttribute("id","password");
prawy.appendChild(password);
br = document.createElement("br");
prawy.appendChild(br);
button = document.createElement("button");
button.setAttribute("onclick","javascript:logowanie()");
button.textContent = "Zaloguj";
prawy.appendChild(button);
}
}
function logowanie()
{
login = document.getElementById("login");
password = document.getElementById("password");
c_login = login.value;
c_password = password.value;
login.value = '';
password.value = '';
var req = createXHR();
req.open('GET', 'ajax.php?mode=2&login=' + c_login + '&haslo=' + c_password, true);
req.onreadystatechange = function ()
{
if (req.readyState == 4)
{
if (req.status != 200)
{
alert("wystąpił błąd!");
}
else
{
if (req.getResponseHeader("Content-Type") != "text/xml")
{
alert ("błędny format danych!");
}
else
{
var odpowiedz = req.responseXML;
var root = odpowiedz.documentElement;
level = root.getElementsByTagName("string")[0].textContent;
if (level == 'OK')
{
loguj = document.getElementById("loguj");
sprawdz = document.getElementById("sprawdz");
wyloguj = document.getElementById("wyloguj");
loguj.style = "display: none;";
sprawdz.style = "display: block;";
wyloguj.style = "display: block;";
prawy = document.getElementById("content");
while (prawy.firstChild)
{
pom = prawy.removeChild(prawy.firstChild);
delete pom;
}
}
}
}
}
}
req.send(null);
}