 Formularz logowania, logowanie bez przeładowywania strony |
| Formularz logowania, logowanie bez przeładowywania strony |
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 4 Pomógł: 0 Dołączył: 14.05.2012 Ostrzeżenie: (0%) 
 |
Usiłuje zbudować formularz logowania oparty na AJAX. Miałem koncepcje, ale nie działa to do końca tak jak bym chciał. Mam pliki: index.php, ajax.js, logowanie.php oraz wylog.php
index.php Kod <?php session_start(); ?> <html> <head> <script type="text/javascript" src="ajax.js"></script> <link rel="stylesheet" href="style.css" type="text/css"> </head> <body> <?php if(isset($_SESSION['prawid_uzyt'])) { ?> Jestes juz zalogowany <?php } else { ?> <form onsubmit="return false;"> <div id="mainDiv"> Login:<input class="pole" id="login" type="text" /> Hasło:<input class="pole" id="haslo" type="password" /> <input type="button" id="przycisk" onclick="zaloguj();" value="zaloguj" /> <br> </div> <?php } ?> <input type="button" id="przycisk" onclick="wyloguj()" value="wyloguj" /> </form> </body> </html> Na tej stronie znajduje się div do którego ładuje wyniki. ajax.js Kod var odpowiedz = null; var login = null; var haslo = null; function AjaxInit() { var zapytanie = null; try { zapytanie = new XMLHttpRequest(); } catch(e) { try { zapytanie = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e2) { try { zapytanie = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e3) { alert("Twoja przeglądarka nie obsługuje ajaxa"); } } } return zapytanie; } function zaloguj() { login = document.getElementById("login").value; haslo = document.getElementById("haslo").value; var zapytanie = AjaxInit(); if(zapytanie != null) { zapytanie.open("POST", "logowanie.php", true); zapytanie.onreadystatechange = function() { if(zapytanie.readyState == 4) { if(zapytanie.status == 200) { odpowiedz = zapytanie.responseText; } } } zapytanie.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); zapytanie.send("login="+login+"&haslo="+haslo); document.getElementById("login").value=""; document.getElementById("haslo").value=""; document.getElementById("mainDiv").innerHTML = odpowiedz; } } function wyloguj() { var zapytanie = AjaxInit(); if(zapytanie != null) { zapytanie.open("GET", "wylog.php", true); zapytanie.onreadystatechange = function() { if(zapytanie.readyState == 4) { if(zapytanie.status == 200) { odpowiedz = zapytanie.responseText; document.getElementById("mainDiv").innerHTML = odpowiedz; } } } } zapytanie.send(null); } Funkcja zaloguj powoduje wysłanie do sktyptu loginu i hasła. zaloguj.php Kod <?php session_start(); $login = $_POST['login']; $haslo = $_POST['haslo']; if(isset($_SESSION['prawid_uzyt'])) { echo "Jestes juz zalogowany"; } elseif($login == "login" && $haslo == "haslo") { $_SESSION['prawid_uzyt'] = $login; echo "zalogowany jako "; echo $_SESSION['prawid_uzyt']; } else{ echo "Niepoprawny login/haslo"; echo "<form onsubmit=\"return false;\">"; echo "Login:<input class=\"pole\" id=\"login\" type=\"text\" \>"; echo "Hasło:<input class=\"pole\" id=\"haslo\" type=\"password\" \>"; echo "<input type=\"button\" id=\"przycisk\" onclick=\"zaloguj();\" value=\"zaloguj\" \>"; echo "<br>"; echo "<form>"; } ?> Skrypt ustawia zmienną sesji $_SESSION['prawid_uzyt'], a jeżeli dane są niepoprawne zwraca formularz logowania. wylog.php Kod <?php session_start(); unset($_SESSION['prawid_uzyt']); session_destroy(); echo "<form onsubmit=\"return false;\">"; echo "Login:<input class=\"pole\" id=\"login\" type=\"text\" \>"; echo "Hasło:<input class=\"pole\" id=\"haslo\" type=\"password\" \>"; echo "<input type=\"button\" id=\"przycisk\" onclick=\"zaloguj();\" value=\"zaloguj\" \>"; echo "<br>"; echo "<form>"; ?> Ten skrypt usuwa zmienną sesji i również wyświetla formularz logowania. Problem polega na tym, że po kliknięciu któregokolwiek przycisku nie ma widocznego efektu. Dopiero gdy nacisnę przycisk po raz drugi lub trzeci skrypt zaczyna działać poprawnie. Podejrzewam, że ma to jakiś związek z rejestrowaniem zmiennych sesji. Może ktoś wie w czym tkwi błąd, albo zasugeruje mi jakieś lepszy sposób na zrobienie logowania bez przeładowywania strony. Zaznaczam, że nie chce używać JQuery i innych gotowych bibliotek. Ten post edytował whomean 21.03.2013, 20:56:30 |
 |
 
|
  |
|
Aktualny czas: 19.08.2025 - 13:16 |
