Login Problems in jQuery

Question

I created a login for my application, but I’m having trouble returning. The user and password panel sends the request to php login (which accesses the database). The return is an 'OK', which should be validated in the code below:

  $('#btnLogin').click(function(){
    var login = $('#inputEmail').val();
    var senha = $('#inputPassword').val();
    $.post('_class/login.php',{inputEmail: login, inputPassword: senha}, function(data){
      console.log(data);
        if(data === 'OK'){
        location.reload();
      }else{
          $('#myModal').modal('show');
      }
    });
  });

Problem: the return is accepting the 'OK', but does not open the home screen and still returns the incorrect login message (myModal). After deleting the error message, while reloading the page (F5), the system opens the home. How can I fix this?

editing-----------------

I’m using the codes: html

 $('#btnLogin').click(function(){

    var login = $('#inputEmail').val();

    var senha = $('#inputPassword').val();

    
    $.post('_class/login.php',{inputEmail: login, inputPassword: senha}, function(data){

      //console.log(data);
      var response = $.trim(data);
          
    	if(data === 'OK'){

        location.reload(true);
    	           
      }else{
    	  
    	  $('#myModal').modal('show');

      }

    });

  });

  <form class="vertical-form" id="new_user" action="_class/login.php" accept-charset="UTF-8" method="post"><legend>

    Acesso

  </legend>

  <input placeholder="Email" label="false" type="text" name="inputEmail" id="inputEmail" />

  <input placeholder="Senha" label="false" autocomplete="off" type="password" name="inputPassword" id="inputPassword" />

  <input type="button" id="btnLogin" name="commit" value="Acessar" />

  <!-- <input type="submit" name="commit" value="Acessar" /> -->

  <p><a style="cursor: pointer;" data-toggle="modal" data-target="#myModal2">Esqueceu sua senha?</a></p>

</form>

Answer 1

I’ve been there and done it:

On the PHP side:

echo trim('OK');

On the Javascript side:

var response = $.trim(data);

if(data === 'OK'){
    location.reload();
}else{
    $('#myModal').modal('show');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>

I used trim() on both sides, because strictly (use strict;) Javascript asks to be used === to make comparisons, in which case all bytes are compared and if one is out of place, returns false.

Using trim() i can delete extra bytes, caused by white spaces for example.