AGB  ·  Datenschutz  ·  Impressum  







Anmelden
Nützliche Links
Registrieren
Zurück Delphi-PRAXiS Programmierung allgemein Programmieren allgemein Javascript funktioniert nicht nach Einbindung von PHP

Javascript funktioniert nicht nach Einbindung von PHP

Ein Thema von anon92 · begonnen am 29. Okt 2020 · letzter Beitrag vom 29. Okt 2020
Antwort Antwort
anon92

Registriert seit: 29. Okt 2020
1 Beiträge
 
#1

Javascript funktioniert nicht nach Einbindung von PHP

  Alt 29. Okt 2020, 13:46
Hallo zusammen,

ich lerne gerade den Umgang mit PHP und co. und habe dafür eine kleine Login-Seite gebastelt, bzw. versuche noch das zu tun.

Ich benutze Laravel/Valet um PHP zu benutzen und habe es heute endlich geschafft die gewünschte Funktion einzubauen. Seitdem funktioniert allerdings mein Javascript nicht mehr, mit welchem es bis dahin keine Probleme gab...

Der Plan war, dass ich mit PHP prüfe ob die Felder leer sind und dann dementsprechend anzeigen lasse dass es notwendig ist diese auszufüllen.
Mit Javascript prüfe ich dann, ob die eingegebenen Daten korrekt sind. Wenn ja gibt es einen Alert dass das Login erfolgreich war, wenn nicht eine Fehlermeldung dass mindestens eine Eingabe nicht richtig ist.
Als Daten habe ich ganz einfach den Usernamen auf user und das Passwort auf password gesetzt. Eine Datenbank muss da nicht eingebaut werden, das Ganze Projekt dient nur der Übung um erstmal reinzukommen.

Hier die HTML-Datei:
Code:
<!DOCTYPE html>
<head>
  <meta charset="UTF-8">
  <title>Login</title>
  <link rel="stylesheet" href="login.css">
  <script defer src="login.js"></script>
</head>

<body>
  <?php
  $usernameErr = $passwordErr = "";
  $username = $password = "";
 
  if ($_SERVER["REQUEST_METHOD"] == "POST") {
   
    if (empty($_POST["username"])) {
      $usernameErr = "Username is required";
    } else {
      $username = test_input($_POST["username"]);
    }

    if (empty($_POST["password"])) {
      $passwordErr = "Password is required";
    } else {
      $password = test_input($_POST["password"]);
    }
  }
  function test_input($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
  }
  ?>

  <main id="main-holder">

    <h1 id="login-header">Login</h1>
   
   <form id="login-form" method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

      <input type="text" name="username" id="username-field" class="login-form-field" placeholder="Username">
       <span class="error">* <?php echo $usernameErr;?></span>
        <br><br>
      <input type="password" name="password" id="password-field" class="login-form-field" placeholder="Password">
       <span class="error">* <?php echo $passwordErr;?></span>
        <br><br>

      <input type="submit" name="submit" value="Submit">
    </form>

    <div id="login-error-msg-holder">
      <p id="login-error-msg">Invalid username <span id="error-msg-second-line">and/or password</span></p>
    </div>

  </main>

</body>
</html>
Und hier die Javascript-Datei:

Code:
const loginForm = document.getElementById("login-form");
const loginButton = document.getElementById("login-form-submit");
const loginErrorMsg = document.getElementById("login-error-msg");

loginButton.addEventListener("click", (e) => {
    e.preventDefault();
    const username = loginForm.username.value;
    const password = loginForm.password.value;

    if (username === "user" && password === "password"){
        alert("You have successfully logged in.");
    } else {
        loginErrorMsg.style.opacity = 1;
    }
})
  Mit Zitat antworten Zitat
Delphi.Narium

Registriert seit: 27. Nov 2017
1.511 Beiträge
 
Delphi 7 Professional
 
#2

AW: Javascript funktioniert nicht nach Einbindung von PHP

  Alt 29. Okt 2020, 14:57
In Deinem HTML kann ich kein Element mit id="login-form-submit" finden. Dies wird jedoch vom JavaScript erwartet.

Fehlt da eventuell bei
Code:
<input type="submit" name="submit" value="Submit">
was?
  Mit Zitat antworten Zitat
Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Ansicht

Forumregeln

Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus

Gehe zu:

Impressum · AGB · Datenschutz · Nach oben
Alle Zeitangaben in WEZ +1. Es ist jetzt 08:53 Uhr.
Powered by vBulletin® Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.
LinkBacks Enabled by vBSEO © 2011, Crawlability, Inc.
Delphi-PRAXiS (c) 2002 - 2021 by Daniel R. Wolf