Mam problem z AJAX i JQUERY. Piszę funkcję logowania do systemu, ale działa tylko po raz pierwszy. Oto mój kod:

HTML w modalnym:

<form role="form" onsubmit=" return login()"  method="post" action="" >
   <div class="form-group">
     <label for="userName"><span class="glyphicon glyphicon-user"></span>E-mail</label>
     <input type="email" name="emailLogin" class="form-control" id="userName" placeholder="e-mail" required>
   </div>
   <div class="form-group">
      <label for="password"><span class="glyphicon glyphicon-eye-open"><span>Password</label>
      <input type="password" name="passLogin" class="form-control" id="password" placeholder="Password" required>
    </div>
    <button type="submit" class="btn btn-success btn-block">Login<span class="glyphicon glyphicon-log-in"></span></button>
</form>

Oto jQuery:

function login(){
  login=document.getElementById('userName').value;
  pass=document.getElementById('password').value;
  var dataString="emailLogin="+login+"&passLogin="+pass;

  $.ajax({
    type: "POST",
    url: "models/handler/KlientHandler.php",
    cache: false,
    data: dataString,
    success: function(text){
      if(text=='0'){
        $("#loginError").removeClass('hidden');
      }else{
        $("#loginOk").removeClass('hidden');
        $("#myModal").modal('hide');
        $("#loginLi").html("<a id=\"user\">"+login+" (Profile)<span class=\"glyphicon glyphicon-user\"></span></a>");
        $("#regLi").html("<a href=\"logout\" id=\"user\">"+login+" (Logout)<span class=\"glyphicon glyphicon-log-out\"></span></a>");
      }
    }
  });
  return false;
}
0
Pado 27 wrzesień 2017, 21:35

2 odpowiedzi

Najlepsza odpowiedź

Nadpisujesz funkcję logowania z ciągiem.

function foo() {
  alert('foo');
  foo = function () {
    alert('bar');
  }
}
<a onclick="foo()">
click me!
</a>

Zobacz, jak drugi kliknięcie tutaj powoduje inny alert? W twoim przypadku zastępujesz funkcję ciągiem zamiast funkcji, powodując błąd składni. Nie zapomnij o var twoich zmiennych.

var login=document.getElementById('userName').value;
var pass=document.getElementById('password').value;
2
Kevin B 27 wrzesień 2017, 18:57

Swiastek testuje logikę i był błąd konsoli dla swoich zmiennych logowania i przepustki. Ustawiam je jako "var" i umieść logikę sukcesu w sekcji "Błąd" żądania Ajax, ponieważ nie mogę osiągnąć serwera, ale tworzy przycisk wylogowania. Czy to, czego chciałeś?

function login() {
    var login = document.getElementById('userName').value;
    var pass = document.getElementById('password').value;
    var dataString = "emailLogin=" + login + "&passLogin=" + pass;

    $.ajax({
        type: "POST",
        url: "models/handler/KlientHandler.php",
        cache: false,
        data: dataString,
        success: function(text) {
          /* Success logic */
        },
        error: function() {
                alert('Test - success logic');
                $("#loginOk").removeClass('hidden');
                //$("#myModal").modal('hide');
                $("#loginLi").html("<a id=\"user\">" + login + " (Profile)<span class=\"glyphicon glyphicon-user\"></span></a>");
                $("#regLi").html("<a href=\"logout\" id=\"user\">" + login + " (Logout)<span class=\"glyphicon glyphicon-log-out\"></span></a>");
        }

    });
    return false;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form role="form" onsubmit=" return login()"  method="post" action="" >
   <div class="form-group">
     <label for="userName"><span class="glyphicon glyphicon-user"></span>E-mail</label>
     <input type="email" name="emailLogin" class="form-control" id="userName" placeholder="e-mail" required>
   </div>
   <div class="form-group">
      <label for="password"><span class="glyphicon glyphicon-eye-open"><span>Password</label>
      <input type="password" name="passLogin" class="form-control" id="password" placeholder="Password" required>
    </div>
    <button type="submit" class="btn btn-success btn-block">Login<span class="glyphicon glyphicon-log-in"></span></button>
</form>

<div id="loginLi"></div>
<div id="regLi"></div>
<div id="loginOk">Login OK</div>
0
Adam Love 27 wrzesień 2017, 19:00