1

He validado los datos de registro mediante javascript, pero al intentar guardar los datos de un registro pulsando en registrar, los datos no se guardan en MySQL. Este es el codigo HTML:

<form class="user" id="form_registro" method="POST">
    <div class="row mb-3">
        <div class="col-sm-6 mb-3 mb-sm-0"><input class="form-control form-control-user" type="text" id="FirstName" placeholder="First Name" name="first_name" /></div>
        <div class="col-sm-6"><input class="form-control form-control-user" type="text" id="LastName" placeholder="Last Name" name="last_name" /></div>
    </div>
    <div class="mb-3"><input class="form-control form-control-user" type="email" id="InputEmail" aria-describedby="emailHelp" placeholder="Email Address" name="email" /></div>
    <div class="row mb-3">
        <div class="col-sm-6 mb-3 mb-sm-0"><input class="form-control form-control-user" type="password" id="PasswordInput" placeholder="Password" name="pass" /></div>
        <div class="col-sm-6"><input class="form-control form-control-user" type="password" id="RepeatPasswordInput" placeholder="Repeat Password" name="password_repeat" /></div>
    </div>
    <button class="btn btn-primary d-block btn-user w-100" type="submit" id="btn_registro" name="registro">Register Account</button>
    <hr />
    <a class="btn btn-primary d-block btn-google btn-user w-100 mb-2" role="button"><i class="fab fa-google"></i>&nbsp; Register with Google</a>
    <a class="btn btn-primary d-block btn-facebook btn-user w-100" role="button"><i class="fab fa-facebook-f"></i>&nbsp; Register with Facebook</a>
    <hr />
</form>

y aquí el script:

    $('#btn_registro').click(function(){
        var datos = $("#form_registro").serialize();

        $.ajax({

            method:"POST",
            url:"registro.php",
            dataType: 'json',
            data:datos,
            succes:function(e){

                if(e==1){
                    alert("Registro exitoso");
                }
                else{
                    alert("Erorr de registro");
                }
            }

        });
            return false;
    });

y este es el php:

<?php
include("conexion.php");

    if(isset($_POST['registro'])){
        $conexion = conectar();
        $nombre = $_POST['first_name'];
        $apellidos = $_POST['last_name'];
        $email = $_POST['email'];
        $password = $_POST['pass'];
        $repeat_password = $_POST['password_repeat'];
        
        $registrar = mysqli_query($conexion, "INSERT INTO users(first_name, last_name, email, pass) 
                    VALUES('$nombre', '$apellidos', '$email', '$password')");
                
    }
?>

No se insertan los datos en MySQL

3
  • Hola. ¿Revisaste en la BD y no hay nada insertado? ¿Has depurado lo que estás enviando al servidor, poniendo un console.log(datos); y revisando la consola del navegador? Por otra parte, no hay ningún control en tu INSERT en el servidor. ¿Qué pasa si no hay conexión? ¿Qué pasa si ocurre un registro duplicado, o un error de sintaxis en la instrucción SQL? Además, ¿ese es todo el código PHP? No estás retornando nada, por tanto, el success no recibirá nada.
    – A. Cedano
    Commented el 4 may. a las 11:54
  • Disculpa, no había usado AJAX nunca. Quiero comprobar de momento que se insertan los registros, pero no se porque no se están guardando. Commented el 4 may. a las 13:46
  • Pero ¿qué te indica que no se están guardando? ¿Revisaste en la base de datos? Como te dije en mi comentario, el código PHP no devuelve nada, por tanto, el if que tienes en el success será siempre false.
    – A. Cedano
    Commented el 4 may. a las 15:25

1 respuesta 1

0

Puedes:

  1. Realizar una validación que te muestre si los datos llegan a PHP.
  2. Agregar al final una validación más que te indique si los datos fueron insertados o no.

Te dejo una propuesta que te puede orientar un poco. Revisa y comenta.

<?php
include("conexion.php");

    //Verifica si te llega la información usando la siguiente línea
    print_r($_POST); die();
    //Después de verificar, la comentas o la eliminas

    if(isset($_POST['registro'])){
        $conexion = conectar();
        $nombre = $_POST['first_name'];
        $apellidos = $_POST['last_name'];
        $email = $_POST['email'];
        $password = $_POST['pass'];
        $repeat_password = $_POST['password_repeat'];
        
        $registrar = mysqli_query($conexion, "INSERT INTO users(first_name, last_name, email, pass) 
                    VALUES('$nombre', '$apellidos', '$email', '$password')");
        
        //Agrega este bloque de código que valida si la información se insertó o no.
        if (!$registrar) {
            echo 0;
        } else {
            echo 1;
        }      
    }
?>

Con la actualización de tu pregunta, asumo que el problema que tienes es en el envío de los datos desde ajax. Si es así, tienes varias opciones:

Revisa con cautela los parámetros en cada opción ya que son diferentes y asegúrate de que el archivo registro.php esté en la misma ruta de los demás archivos, porque si está en un subfolder debes modificar la ruta.

  1. Crear un objeto con cada uno de los campos.
$("#form_registro").submit(function(evento) {
  evento.preventDefault();

  let datos = {
    "nombre": $('#FirstName').val(), 
    "apellido": $('#LastName').val(), 
    "mail": $('#InputEmail').val(), 
    "password": $('#PasswordInput').val(), 
    "repeat_password": $('#RepeatPasswordInput').val(),
  };
  
  $.ajax({
    url: "registro.php",
    type: "POST",
    data: datos,
    cache: false,
    succes: function(e) {
      if (e == 1) {
        alert("Registro exitoso");
      } else {
        alert("Error de registro");
      }
    },
    error: function(jqXHR, textStatus, errorThrown) {
      alert('Your form was not sent successfully.');
    }
  });
  
  return false;
});
  1. Usar FormData: no uses dataType: 'json'
$(document).ready(function () {                 
  $('#form_registro').submit(function (event) { 
    event.preventDefault(); 
    let formData = new FormData($('#form_registro')[0]); 
              
    $.ajax({ 
      url: 'registro.php', 
      method: 'POST', 
      data: formData, 
      processData: false, 
      contentType: false, 
      success: function (e) {                       
        if(e == 1){
          alert("Registro exitoso");
        } else{
          alert("Error de registro");
        } 
      },
      error: function(jqXHR, textStatus, errorThrown) {
        alert('Your form was not sent successfully.');
      }
    });
    
  }); 
});
  1. Usar Serialize:
$(document).ready(function() {
  $('#form_registro').submit(function(e) {
    e.preventDefault();
    let formData = $(this).serialize();

    $.ajax({
      url: 'registro.php',
      type: 'POST',
      data: formData,
      success: function(e) {
        if(e == 1){
          alert("Registro exitoso");
        } else{
          alert("Erorr de registro");
        }
      },
      error: function(jqXHR, textStatus, errorThrown) {
        alert('Your form was not sent successfully.');
      }
    });
  });
});
7
  • 1
    Lo consulta original era correcta rodeando cada variable de comillas simples "INSERT INTO users(first_name, last_name, email, pass) VALUES('$nombre', '$apellidos', '$email', '$password')", si las quitas tendrás error de sintaxis. Aunque lo mejor sería escribir una consulta preparada, pero ese es otro tema.
    – A. Cedano
    Commented el 4 may. a las 16:45
  • hola, he modificado el código a este: Commented el 5 may. a las 15:20
  • está mas arriba Commented el 5 may. a las 15:28
  • Sé que es un ejemplo, pero tenga en cuenta que usar "mysqli_query" de esta manera abre la consulta a un "ataque de inyección SQL". Deberías utilizar una "prepared statement" para protegerse contra eso.
    – Peter M
    Commented el 5 may. a las 16:05
  • @PeterM lo se, pero no viene al caso. Si bien es importante el tema de seguridad, estoy tratando de orientar al AP sobre como enviar los datos a PHP a través de ajax.
    – DjCrazy
    Commented el 5 may. a las 16:35

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.