Forum PHP.pl

Witajcie

Borykam się z problemem, jak zrobić by zależności od tego co powie php podmieniany był DIV a nie przeładowywana cała strona

strona projektu

http://cctv-online.pl

Zerknijcie o co mi chodzi,
w tym momencie kiedy podane jest błędne hasło albo login strona się przeładowuje, a docelowo ma być tak, że podmieniany będzie tylko ten div co ma bg czerwone, tak jak to zrobiłem w przypadku włączenia CapsLock i chęci wpisania hasła.

Nie wiem jak to ugryźć, bo informacji jest kilka?
Czy ma to być zrobiona w Javie czy po stronie serwera, jak do tej pory.

Wszelkie sugestie i podpowiedzi mile widziane

Pozdrawiam Tomek

Czy dobrze myślę, że powinienem zrobić tak aby po kliknięciu nie przekierowywał na początek strony tylko, do jakiegoś CASE, który będzie w zależności od wyników PHP otrzymywał daną zawartość w div o takim samym ID, a potem w css zrobić taki szablon dla tego jednego DIVa. I zrobić to JS

Ten post edytował topcio 15.11.2017, 16:03:25

Poczytaj o ajax. I na ma pewno nie ma to być zrobione w javie tylko javascript.

Wiem, że JS a nie Java - napisałem skrót myślowy
Nie da się tego zrobić bez AJAXa, jakoś mi nie po drodze w tej chwili opanowywać AJAXa

Jeśli nie chcesz przeładować całej strony to inaczej się nie da.
https://prophp.pl/advice/show/20/pierwsze_k..._i_czym_jest%3F

Witam

Przeprosiłem się do AJAXa, udało się, ale mam pewien problem.
Od rana szukam rozwiązania ale jakoś bez skutecznie

Otóż jeden ze skryptów JS siedzi w pliku ładowanym przez AJAX, i tu jest problem nie wiem jak zrobić by się on wykonał po wczytaniu.

Proszę o pomoc.

[HTML] pobierz, plaintext 
eval(element_w_ktorym_jest_odpowiedz_z_ajaxa.querySelector('script').innerHTML);
[HTML] pobierz, plaintext 

próbowałem, ale albo jestem zbyt tępy na to albo coś źle robię

wpisuję to w plik zewnętrzny scripts.js, który jest ładowany w head - czy tak ma być
od razu po nawiasie wpisuję id diva

w konsoli dostaję:
scripts.js:92 Uncaught TypeError: Cannot read property 'querySelector' of null
at scripts.js:92
scripts.js:92 Uncaught TypeError: Cannot read property 'innerHTML' of null
at scripts.js:92

Ten post edytował topcio 19.11.2017, 22:51:28

Wywołujesz po tym jak wstawisz odpowiedź do danego elementu.
Zobacz na czym operuje metoda querySelector: https://developer.mozilla.org/pl/docs/Web/A...t/querySelector

sorki, ale nie potrafię tego zrozumieć. Czy mogę prosić o łopatologiczne wytłumaczenie tego zagadnienia.

Poczytaj o jsonp.
Kod ma być wywołany na done (jqury). Zależy co tam użyłeś.

zrobiłem trochę na około ale efekt, którego oczekiwałem

[HTML] pobierz, plaintext 
function LoginTest() {
    request = "";
    request = new XMLHttpRequest();
    var InputLogin = document.getElementById("input_login").value;
    var InputPass = document.getElementById("input_pass").value;
    var post = "user_login=" + InputLogin + "&user_pass=" + InputPass;
    var url = "../php_function/user_check.php";
    request.onreadystatechange = LoginTestRequest;
    request.open("POST", url, true);
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    request.send(post);
}
id=document.getElementById('user_blocked_time')
function odliczaj(id,sek){
    seconds = Math.floor(sek)%60;
    minutes = Math.floor(sek/60)%60;
    id.innerHTML=((minutes < 10) ? '0' + minutes : minutes)+ ':' +((seconds < 10) ? '0' + seconds : seconds);
    if(sek>0)setTimeout(function(){
        odliczaj(id,--sek)
    },1e3)
}
 
function LoginTestRequest() {
        if(request.readyState == 4 && request.status == 200) {
            if(request.responseText == "User Logged IN") {
                window.location = "index.php";
            }
            if (!isNaN(request.responseText)){
                $("#login_message_one").empty();
                    var time_to_unlock = request.responseText;
                    var newdiv = document.createElement('div');
                    newdiv.setAttribute("class", "div_testowy");
 
                    var script = document.createElement('script');
                    script.setAttribute("language", "javascript");
                    script.innerHTML = "odliczaj(user_blocked_time, " + time_to_unlock + ");";
                    newdiv.appendChild(script);
                    var newspan = document.createElement('span');
                    newspan.setAttribute("id", "user_blocked_time");
                    newdiv.appendChild(newspan);  
 
                    document.getElementById('login_message_one').appendChild(newdiv);
            }
            else {
                document.getElementById("login_message_one").innerHTML = request.responseText;
            }
        }
        else {
            document.getElementById("login_message_one").innerHTML = request.status+" "+request.statusText;
        }
    }
 
[HTML] pobierz, plaintext 

Jeszcze trochę muszę dopisać, ale już prawie jest cel

Mieszasz jquery z czystym js. Zdecyduj się co chcesz używać. Albo sobie ułatwiasz życie, albo rezygnujesz z jquery.

to tylko jedna rzecz w jquery, ale masz rację poprawię na zwykłe js.
Ach i pytanko, może wiecie czemu to nie działa w IE, w pozostałych jest OK. Chrome, ff, opera.

Ten post edytował topcio 20.11.2017, 10:58:51

Więc jaki sens osadzania dodatkowego kodu na stronie skoro jedna rzecz? Chociaż myślę że akurat tobie na początek w drugą stronę by bardziej pasowało. Nie ma co ukrywać że pisze się łatwiej i nie pewnie nie było by nullem.

mówisz, że w jquery pisze się łatwiej?
Tylko najpierw muszę bardziej opanować czystego js, bo za chwilę zrobi mi się w głowie sieczka. Wcześniej się tym nie zajmowałem, robiłem tylko w php, trochę w VB. Teraz musiałem zacząć poszerzać wiedzę o css, js, pewnie jeszcze coś się znajdzie.


No to pojawił mi się jeszcze jeden problem.
Mianowicie. Wszystko ładnie działa gdy js jest włączone w przeglądarce ale gdy wyłączę to już nie jest tak pięknie.

[PHP] pobierz, plaintext 
case 'log_in':
$users->cookie_form();
echo "<div id=\"wrapper\">";
    echo "<header>";
        echo "<div class=\"login\">";
            echo "<div class=\"test\">";
                echo "SYSTEM ZARZĄDZANIA MONITORINGIEM";        
            echo "</div>";
            echo "<div class=\"test\">";
 
 
 
                echo "<form id=\"form_login\" method=\"post\">";
 
 
 
                echo "<script type=\"text/javascript\"><!--document.write('<input type=\"hidden\" name=\"js\" value=\"1\">');//--></script>";
                echo "<noscript><input type=\"hidden\" name=\"js\" value=\"0\"></noscript>";
 
 
                echo "<span id=\"span_login\">LOGOWANIE</span>";
                echo "<div class=\"text_login\">";
                echo "<span class=\"login\">Login: </span>";
                echo "<input class=\"login\" id=\"input_login\" type=\"text\" placeholder=\"Login\" name=\"user_login\" value=\"" . ((isset($_COOKIE['user_login'])) ? $_COOKIE['user_login'] : '' . ((isset($_POST['user_login'])) ? ($_POST['user_login']) : '' ) . '' ) . "\">";
                echo "</div>";
                echo "<div class=\"text_login\">";
                echo "<span class=\"login\">Hasło: </span>";
                echo "<input class=\"login\" id=\"input_pass\" type=\"password\" placeholder=\"Hasło\" onkeypress=\"capLock(event)\" name=\"user_pass\" value=\"\">";
                echo "</div>";
            echo "</div>";
            echo "<div class=\"test\">";
                echo "<span id=\"info\" style=\"visibility:hidden\">INFORMACJA</span>";
                echo "<span id=\"login_message_one\"></span>";
            echo "</div>";
            echo "<div class=\"test\">";
                echo "<button id=\"submit\" class=\"submit_button\" type=\"button\" form=\"form_login\"><span class=\"submit\">LOGIN</span></button>";  
 
                     echo "</form>";   
 
 
 
            echo "</div>";
            echo "<div class=\"test\" id=\"CapLock\">";
                echo "CAPS LOCK IS ON";        
            echo "</div>";
        echo "</div>";
    echo "</header>";
echo "</div>";
break;
 
[PHP] pobierz, plaintext 

I nie działa submit po wciśnieciu enter.
Wiem czemu, bo w formularzu nie ma action ani w button nie ma formaction.
Gdy jednak to wpiszę to enter działa, ale wszystkie info zamiast pojawiać się ajaxem w wyznaczonym DIV pojawiają się w nowo otwartym oknie jako wynik funkcji php.
Jak to ze sobą pogodzić.

Czego oczekuję.
Enter dla formularza ma działać.
Po przesłaniu formularza php sprawdza najpierw czy jest włączona javascript, jeśli tak wykonuje swoje, jeśli nie wyświetla info i też wykonuje swoje ale bez obsługi js.
Jest to do osiągnięcia?

Ty poważnie tak piszesz? 40 linijek oddzielnie echowanych z czego jedna potrzebuje php?
button nie jest type=submit więc co sie ma wysłać.

Tak, poważnie tak piszę, a jest w tym jakiś błąd? Po za tym, że mam więcej do napisania. Z tym, że to jest tylko wycinek pliku, jeden mały formularz, reszta pliku jest w php pisana.
Ale rzeczywiście wolę napisać echo niż zamykać phpa, potem go otwierać, albo pisać kod w kilku liniach bez echa.


A wracając do problemu, masz rację nie jest submit, ale gdy go zrobię submit to przy entarze odświerza mi całą stronę

Ten post edytował topcio 21.11.2017, 12:10:03

Skoro robisz to na wyłączonym JS (przynajmniej tak zakładam z wcześniejszego posta) to czego się spodziewasz? event.preventDefault nie zadziała.
Problem taki że dajesz parserowi mase niepotrzebnej pracy. No i wygląda tragicznie.
Poza tym w PHP7
$_COOKIE['user_login'] ?? $_POST['user_login'] ?? ''

Myśle, że to kwestia przyzwyczajenie. Dla mnie jest to czytelne. I tak mi się lepiej pisze.

Sprawdzam na włączonym i wyłączonym JS.

Poważnie taka sieczka jest dla ciebie czytelna? Nieźle. Już nawet można to było wyrzucić do zewnętrznego pliku i zaincludować a tam tylko zostawić jedną linię.
Domyślną akcją formularza jest wysyłka. Jak nie ma kodu JS który ją blokuje to jest prawidłowe działanie przeglądarki.