Problems with ajax form

Question

Problems with ajax form

Asked 8 years, 1 month ago

Viewed 62 times

1

Well guys, I’m having a really hard time validating this page in ajax, I think the problem is in the php connection file, I searched in numerous Formularios but I didn’t want something so complex or with so many validations, just something simple, I’ll post the files, when I click in it keeps taking me to php page, instead of doing everything in the background without reloading, and error/success messages also do not appear in div "#error".

login js.

$('document').ready(function(){

	$("#entrar").click(function(){
		var data = $("#form").serialize();
			
		$.ajax({
			type : 'POST',
			url  : 'login.php',
			data : data,
			dataType: 'json',
			beforeSend: function()
			{	
				$("#entrar").html('Validando ...');
				
				
			},
			success:function(response){						
				if(response.codigo == "1"){	
					$("#entrar").html('Entrar');
					$("#error").html('ACESSO PERMITIDO')
					setTimeout(' window.location.href = "index.php"; ',4000);
				}
				else{			
					$("#entrar").html('Entrar');
					$("#error").html('<strong>Usuario e/ou senha incorreto </strong>');
				}
		    }
			
		});
	
	});

});

<html>
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
<script src="login.js"></script> 
<body>

<div id="error"></div>
<form id="form" method="post" action="login.php">
<center> <input class=borda name="login" type="text" required="true" class="form-group" id="login" placeholder="Usuário" title="Informe o usuário."/></center>
<br>
<center><input class=borda name="senha" type="password" id="senha" class="txt-form-control" placeholder="*****" required="true" title="Informe a senha."></center>
 
       
<center>
  <p>
<input type="submit" name="entrar" id="entrar" onclick=""  value="ENTRAR">
    
   </p>
  <p><a href="cadastro.php">Cadastre-se</a> </p>

</center>
</form>

</body>
</html>

 <?php 
    $login = $_POST['login'];
    $entrar = $_POST['entrar'];
    $senha = md5($_POST['senha']);
    $connect = mysql_connect('localhost','root','root', 'db_test');
    $db = mysql_select_db('db_test');
        if (isset($entrar)) {

    //Consulta no banco de dados
  $sql="select * from usuario where login='".$login."' and senha='".$senha."'"; 
  $resultados = mysql_query($sql)or die (mysql_error());
  $res=mysql_fetch_array($resultados); 

    // Se login e senha estiverem certos 

 if (@mysql_num_rows($resultados) !== 0){
        $retorno = array('codigo' => '1');
        if(!isset($_SESSION))   
        session_start();
        header("Location: success.php");    
        $_SESSION['nomeUsuario']=$res['login'];
        echo json_encode($retorno);
    }else{
        $retorno = array('codigo' => '0');
    echo json_encode($retorno);
    exit();


        exit;   
}
        }

?>

Already tried using Event.preventDefault() ?

– Johnny Gabriel

2016/10/30 at 14:24

1 answer

Browser other questions tagged php javascript html ajax

You are not signed in. Login or sign up in order to post.

by Sampaio Leal • **544** points · Answer 1 · 2016-10-08T00:39:29+00:00

You are submitting the form even without Ajax, because you set the method attribute as POST, and the action!

Try to remove these attributes from your form and see if it works, if it doesn’t work, let us know!

Another thing, have you tested if this code has vulnerabilities? You could try Php Login Minimal, a good script for login systems!

Php Login Minimal: https://github.com/panique/php-login-minimal

Updating:

I remembered a trick. Try to remove the Submit button, this button will always try to submit the form! Create a button outside the tag <form> and create an event in jQuery for when it is clicked!