Hallo,
ich hab ein Formular (Login) das in einem Modal sich öffnet.
Jetzt habe ich das Problem, das es sich schließt wenn ich auf Login drücke.
Ich würde es gerne geöffnet lassen. Eine Fehlermeldung wenn es falsch ist oben ausgeben lassen. Also über dem Input feld.
Wenn es richtig ist soll da stehen das es erfolgreich war( in der titel leiste des modals) das login wird ausgegraut und der button wird von login zu schließen.
nachdem ich auf schließen gedrückt habe. soll es sich schließen und die seite im hintergrund neuladen damit die $_Session variabeln berücksichtigt.
Hier mal mein Code dazu:
Im Login.php befindet sich ausschließlich das modal.
in der Javascript datei login.js befindet sich der Ajax teil.
es soll die check.php aufgerufen werden, in der mit hilfe einer Datenbank überprüft werden soll ob ein login zustande kam oder nicht.
Da es noch überhaupt nicht geht ein code um nur die rückgabe zu testen:
Soo... könnt ihr mir auf die Sprünge helfen, wo ich den Fehler gemacht habe? Ich habe jetzt eigentlich erwartet das ich irgendwas zurück bekomme, aber das modal schließt sich direkt.
ich hab ein Formular (Login) das in einem Modal sich öffnet.
Jetzt habe ich das Problem, das es sich schließt wenn ich auf Login drücke.
Ich würde es gerne geöffnet lassen. Eine Fehlermeldung wenn es falsch ist oben ausgeben lassen. Also über dem Input feld.
Wenn es richtig ist soll da stehen das es erfolgreich war( in der titel leiste des modals) das login wird ausgegraut und der button wird von login zu schließen.
nachdem ich auf schließen gedrückt habe. soll es sich schließen und die seite im hintergrund neuladen damit die $_Session variabeln berücksichtigt.
Hier mal mein Code dazu:
Im Login.php befindet sich ausschließlich das modal.
Code:
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="true" aria-controls="navbar"> <span class="sr-only">Navigation ein-/ausblenden</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="<?php echo $_SERVER['REQUEST_URI']; ?>">Miyava</a> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href="#" data-toggle="modal" data-target="#myModal">Login</a></li> </ul> </div> </div> </nav> <div style="margin-top:50px;" class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">Einloggen</h4> </div> <!-- /.modal-header --> <form role="form" method="POST"> <div class="modal-body"> <div class="form-group"> <div class="input-group"> <input style="margin-top:1px;" name="name" type="text" class="form-control" id="uLogin" placeholder="E-Mail"> <label for="uLogin" class="input-group-addon glyphicon glyphicon-user"></label> </div> </div> <!-- /.form-group --> <div class="form-group"> <div class="input-group"> <input style="margin-top:1px;" name="paddword" type="password" class="form-control" placeholder="Passwort"> <span class="input-group-addon glyphicon glyphicon-lock"></span> </div> <!-- /.input-group --> </div> <!-- /.form-group --> <!--<div class="checkbox"> <label> <input type="checkbox"> Eingeloggt bleiben </label> </div> <!-- /.checkbox --> </div> <!-- /.modal-body --> <div class="modal-footer"> <input type="submit" Name="login" class="form-control btn btn-primary" value="Login"> <div class="progress"> <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="1" aria-valuemin="1" aria-valuemax="100" style="width: 0%;"> <span class="sr-only">progress</span> </div> </div> </div> <!-- /.modal-footer --> </form> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->
in der Javascript datei login.js befindet sich der Ajax teil.
Code:
$(document).submit(function(){ var result = $("#login").load("check.php"); if(result == 'ok'){ $('.modal-footer button').click(function(){ var button = $(this); if ( button.attr("data-dismiss") != "modal" ){ var inputs = $('form input'); var title = $('.modal-title'); var progress = $('.progress'); var progressBar = $('.progress-bar'); inputs.attr("disabled", "disabled"); button.hide(); progress.show(); progressBar.animate({width : "100%"}, 100); progress.delay(1000) .fadeOut(600); button.text("Schließen") .removeClass("btn-primary") .addClass("btn-success") .blur() .delay(1600) .fadeIn(function(){ title.text("Erfolgreich eingeloggt"); button.attr("data-dismiss", "modal"); }); } }); }else { $('#myModal').on('hidden.bs.modal', function (e) { var inputs = $('form input'); var title = $('.modal-title'); var progressBar = $('.progress-bar'); var button = $('.modal-footer button'); inputs.removeAttr("disabled"); title.text("Einloggen"); progressBar.css({ "width" : "0%" }); button.removeClass("btn-success") .addClass("btn-primary") .text("Login") .removeAttr("data-dismiss"); }); } });
es soll die check.php aufgerufen werden, in der mit hilfe einer Datenbank überprüft werden soll ob ein login zustande kam oder nicht.
Da es noch überhaupt nicht geht ein code um nur die rückgabe zu testen:
PHP-Code:
<?php
if (isset($_POST['login'])) {
if(isset($_REQUEST['password']) && isset($_REQUEST['name'])){
$password = $_REQUEST['password'];
$name = $_REQUEST['name'];
return 'ok';
} else {
$error = "Email oder Passwort waren nicht richtig.";
return $error;
}
}
?>
Soo... könnt ihr mir auf die Sprünge helfen, wo ich den Fehler gemacht habe? Ich habe jetzt eigentlich erwartet das ich irgendwas zurück bekomme, aber das modal schließt sich direkt.
Kommentar