Hallo liebe User, ich hoffe Ihr könnt mir weiterhelfen.
Ich habe eine Login seite, die die Logindaten mit Ajax weiter sendet. Zur zeit funktioniert dies aber nur wenn ein Alert dazwischen steht. Ich habe schon ähnliche Fehler gesucht und gefunden aber ich kann die Lösungen nicht adaptieren. Jetzt hoffe ich, dass ihr mir den Fehler erklären könnt und mir sagt/zeigt wie man diesen verhindern kann.
Zur veranschaulichung hier der Code:
Auch den von der ausgelagterten login.js möchte ich euch nicht vorenthalten, falls da der Fehler ist
Ich hoffe ihr könnt mir helfen.
Ich habe eine Login seite, die die Logindaten mit Ajax weiter sendet. Zur zeit funktioniert dies aber nur wenn ein Alert dazwischen steht. Ich habe schon ähnliche Fehler gesucht und gefunden aber ich kann die Lösungen nicht adaptieren. Jetzt hoffe ich, dass ihr mir den Fehler erklären könnt und mir sagt/zeigt wie man diesen verhindern kann.
Zur veranschaulichung hier der Code:
Code:
@import models.db.Studiengang
@(loggedIn: String)(studiengaenge: List[String])
@main("Login"){
<div class="title">
<h1>Campusduell</h1>
</div>
<div class="container">
<div class="card"></div>
<div class="card">
<h1 class="title">Login</h1>
<form>
<div class="input-container">
<input type="text" id="loginUsername"/>
<label for="loginUsername">Nutzername</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="password" id="loginPassword"/>
<label for="loginPassword">Passwort</label>
<div class="bar"></div>
</div>
<div class="button-container">
<button id="login"><span>anmelden</span></button>
</div>
</form>
</div>
<div class="card alt">
<div class="toggle"></div>
<h1 class="title">Registrierung
<div class="close"></div>
</h1>
<form>
<div class="input-container">
<input type="text" id="registUsername"/>
<label for="registUsername">Nutzername</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="password" id="registPassword"/>
<label for="registPassword">Passwort</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="password" id="controlPassword"/>
<label for="controlPassword">Kontroll-Passwort</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="text" id="email"/>
<label for="email">E-Mail</label>
<div class="bar"></div>
</div>
<div class="input-container">
<div class="Registrierung">
Geschlecht:
<select id = "geschlecht">
<option value="1" selected>M</option>
<option value="2" selected>W</option>
</select><br><br>
Studiengang:
<select id = "studiengang">
@for(studiengang <- studiengaenge){
<option value = @studiengang selected> @studiengang </option>
}
</select>
</div>
</div>
<div class="button-container">
<button id = "validation"><span>Los geht's</span></button>
</div>
</form>
</div>
</div>
<script>
checkLoggedIn(@loggedIn);
// Dieser Code bewirkt, dass die Navigationsleiste nicht angezeigt wird
document.getElementById("navigationsleiste").style.visibility = "hidden";
var username;
var password;
var email;
var geschlecht;
var studiengang;
var result;
$("#validation").click(function(){
username = $("#registUsername").val();
password = $("#registPassword").val();
email = $("#email").val();
geschlecht = $("#geschlecht").val();
studiengang = $("#studiengang").val();
sendRegister(username, password, email, geschlecht, studiengang);
});
$("#login").click(function(){
username = $("#loginUsername").val();
password = $("#loginPassword").val();
sendLogin(username, password);
// alert("Mit diesem alert funkioniert es.")
});
$('.toggle').on('click', function() {
$('.container').stop().addClass('active');
});
$('.close').on('click', function() {
$('.container').stop().removeClass('active');
});
</script>
}Auch den von der ausgelagterten login.js möchte ich euch nicht vorenthalten, falls da der Fehler ist
Code:
function sendRegister(username, passwort, email, geschlecht, studiengang){
$.ajax({
url: '/registration',
method: 'POST',
data: JSON.stringify({
"username": username,
"passwort": passwort,
"email": email,
"geschlecht": geschlecht,
"studiengang": studiengang,
}),
success: function(data){
$('#result').text("Success");
},
error:function(data){
$('#result').text("Failure");
},
dataType: 'json',
contentType: 'application/json'
});
return false;
}
function sendLogin(username, passwort, loggedIn){
$.ajax({
url: '/login',
method: 'POST',
data: JSON.stringify({
"username": username,
"passwort": passwort,
}),
success: function(data){
$('#result').text("success");
},
error:function(data){
$('#result').text("Failure");
},
dataType: 'json',
contentType: 'application/json'
});
return false;
}
function registrieren(){
function vergleichPasswort(registPassword, controlPassword) {
return (registPassword == controlPassword)
? true : alert("Das Passwort wurde richtig eingegeben!")
? false : alert("Die Passwörter sind nicht identisch");
}
function passwort(form) {
if(vergleiche("batman", form.pass.value))
alert("das Passwort wurde richtig eingegeben!");
else {
alert("das Passwort ist falsch!");
form.pass.select();
form.pass.focus();
}
}
}
/*
Diese Funktion checkt, ob der User schon eingeloggt ist
Wenn ja und er ist auf der Login Seite -> Home seite geleitet
Wenn nein und er ist nicht auf der Login Seite -> Login seite geleitet
*/
function checkLoggedIn(login){
var site = window.location.pathname;
if(site != "/login" && login != "1"){
alert("Der User ist nicht eingeloggt und wird zur Login-Seite weitergeführt!");
window.location = "/login";
}
else if(site == "/login" && login == "1"){
window.location = "/home";
}
}Ich hoffe ihr könnt mir helfen.
