Tengo un par de dudas con AJAX. Estoy tratando de guardar los datos de un formulario y quiero retornar una respuesta la cual estoy instanciando en mi metodo ajax y construyendo en la query del DAO para ser devuelta como log.
Aquí pueden ver mi formdata y mi ajax:
var infoEmpleado = new FormData();
var nombre = $('input[name="nombre"]').val();
var apellidos = $('input[name="apellidos"]').val();
var email = $('input[name="email"]').val();
var accion = $('input[name="accion"]').val();
infoEmpleado.append('nombre', nombre);
infoEmpleado.append('apellidos', apellidos);
infoEmpleado.append('email', email);
infoEmpleado.append('accion', accion);
$.ajax({
url: '../controller/empleadoControlador.php',
type: 'POST',
contentType: false,
data: infoEmpleado,
processData: false,
cache: false,
success: function(data) {
const xhr = new XMLHttpRequest();
const respuesta = JSON.parse(xhr.responseText);
if (respuesta.respuesta == 'correcto') {
Swal.fire({
position: 'center',
type: 'success',
title: 'Alta completada',
showConfirmButton: false,
timer: 1500
})
setTimeout(function() {
window.location.replace("../index.php");
}, 2000);
} else {
Swal.fire({
type: 'error',
title: 'Oops...',
text: 'ID o password incorrecto',
showConfirmButton: false,
timer: 1500
})
}
}
});
Aquí tengo el controlador que recibe los datos para mandarlos al DAO:
if ($_POST['accion'] == 'crearEmpleado') {
$empleado = new Empleado();
$empDao = new EmpleadoDAO();
$nombre = $empleado->setNombre($_POST['nombre']);
$apellidos = $empleado->setApellidos($_POST['apellidos']);
$email = $empleado->setEmail($_POST['email']);
$empDao->insertarEmpleado($empleado);
}
Y aquí el DAO que lo recibe y donde he decidido construir la respuesta:
public function insertarEmpleado($empleado)
{
$stmt = $this->db->prepare("INSERT INTO empleado (nombre, apellidos, email) VALUES (?, ?, ?)");
$stmt->bindValue(1, $empleado->getNombre());
$stmt->bindValue(2, $empleado->getApellidos());
$stmt->bindValue(3, $empleado->getEmail());
$resultadoRegistro = $stmt->execute();
if ($resultadoRegistro) {
$respuesta = array(
'respuesta' => 'correcto',
'datosEmpleado' => array(
'nombre' => $empleado->getNombre(),
'apellidos' => $empleado->getApellidos(),
'email' => $empleado->getEmail(),
)
);
echo json_encode($respuesta);
return $this->db->lastInsertId();
} else {
$respuesta = array(
'respuesta' => 'error'
);
echo json_encode($respuesta);
return -1;
}
}
La consola me retorna esto:
Uncaught SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)
at Object.success (app.js:97)
at fire (jquery-1.12.4.js:3232)
at Object.fireWith [as resolveWith] (jquery-1.12.4.js:3362)
at done (jquery-1.12.4.js:9840)
at XMLHttpRequest.callback (jquery-1.12.4.js:10311)
No sé cómo hacerlo y la documentación no la entiendo. Necesito que me lo expliquen como si fuera tonto por favor.
success: function(respuesta) {
el parámetrorespuesta
representa, como su nombre bien indica, la respuesta del servidor, o sea, todo lo que sale por pantalla desde el servidor, si la petición tuvo éxito (success). Eso no tiene nada que ver con lo mandaste endata
, que es lo que recibe el servidor en$_POST
. En cuanto a la 2ª duda: eso depende de lo que ocurra en tu archivocontroladorModelo.php
. Debes seguir el flujo del mismo, depurando las variables que maneje, para determinar por qué siempre termina diciendo que ha guardado con éxito.JSON.parse
sin antes comprobar que el servidor responde siempre un JSON. Debes escribir un código coherente. Esto no tiene sentido:return $this->db->lastInsertId();
por lo tanto comenta esa línea. Esto tampoco tiene sentido:return -1;
comenta también esa línea y prueba. Al poner esosreturn
puede que te estén fastidiando el JSON. Y prueba la respuesta haciendo unconsole.log(xhr.responseText);
directamente. No es cuestión de volverse loco, sino de aprender a depurar, a probar qué hay en los datos, ¿me explico?