Hols! I am trying to make a Form that validates the email, it is something simple and even then it does not work for me. it tells me that there is a mistake with the js, I am new using ajax and it still costs me he says
ajax-form.js:28 Uncaught TypeError: Cannot set property 'innerHTML' of null at XMLHttpRequest.xhr.onreadystatechange (ajax-form.js:28)
mi js
document.getElementById("cambiar").addEventListener("click",cambiar);
document.getElementById("enviar").addEventListener("click",enviar);
function cambiar(){
var xhr = new XMLHttpRequest();
xhr.send();
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
document.getElementById("parrafo").innerHTML = xhr.responseText;
}
}
}
function enviar(){
var su_correo = "correo="+document.getElementById("correo").value;
var xhr = new XMLHttpRequest();
xhr.open("POST","login.php");
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send(su_correo);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4 && xhr.status == 200){
console.log(xhr.responseText);
document.getElementById("respuesta").innerHTML = xhr.responseText;
}
}
}
my php
<?php
include("db.php");
$db_con = new PDO('mysqli:host=localhost;dbname=user_login', 'root', '');
if (filter_var($_POST['correo'], FILTER_VALIDATE_EMAIL)) {
echo 'Correo Válido';
}
else {
echo 'No Válido';
}
?>
my html
<title>Login</title>
</head>
<body>
<p id="parrafo">¿Cuál es tu correo?</p>
<button id="cambiar">¿Disculpa?</button>
<input type="email" id="correo">
<button id="enviar">Enviar</button>
<p id=”respuesta”></p>
<script src="js/ajax-form.js" type="text/javascript"></script>
</body>
This helps me to login, thank you very much