0

Buen dia, estoy creando una comprobacion de formulario y queria ver si habia alguna forma de simplificarlo, el codigo funciona codigo php:

$validar_titulo = $_POST["tituloLibro"];
if(empty($validar_titulo)){
        $error = 'el titulo es necesario';
        ?>
        <script>
            let span = document.getElementById('errorSpanTitulo');
            span.innerHTML = "<?php echo '*' . ucfirst($error);?>";
            span.style.margin = "0 0 0 5px";
        </script>
        <?php
    }else{
        $titulo = $validar_titulo;
        ?>
        <script>
            document.getElementById('tituloLibro').value="<?php echo $titulo; ?>"
        </script>
        <?php
    }

esto se repite con todos los campos del formulario, por lo que el codigo se hace extenso, si me falto agregar algo por favor digan, gracias. otro ejemplo:

$validar_autor = $_POST["autorLibro"];

$pattern = "/^[a-zA-Z\sñáéíóúÁÉÍÓÚ]+$/";


if(empty($validar_autor) || !preg_match($pattern, $validar_autor)){
        $error = 'el autor es necesario';
        ?>
        <script>
        let span = document.getElementById('errorSpanAutor');
        span.innerHTML = "<?php echo '*' . ucfirst($error);?>";
        span.style.margin = "0 0 0 5px";
        </script>
        <?php
    }else{
        $autor = $validar_autor;
        ?>
        <script>
            document.getElementById('autorLibro').value="<?php echo $autor; ?>"
        </script>
        <?php
    }
8
  • Para escribir una buena respuesta habría que ver el tipo de validaciones que realizas y entender el por qué las estás haciendo del lado del servidor. Para lo que muestras, la validación del lado del cliente suele ser suficiente y, de hecho, con el atributo required de la etiqueta <input>, no hace falta validación, el browser se encarga de exigir que el campo tenga un valor. Así, el código en PHP se reduce a 0 líneas.
    – jachguate
    Commented el 22 jun. 2023 a las 1:06
  • hola, en realidad le agregue la verificacion del lado del servidor porque lei que el required no era seguro, y este solo es el que tiene el empty, los demas tienen otras verificaciones como que tengan ciertos caracteres o que sean menores que x numero, ahora edito el post Commented el 22 jun. 2023 a las 1:25
  • ¿En qué sentido no es seguro el required?
    – jachguate
    Commented el 22 jun. 2023 a las 1:50
  • stackoverflow.com/questions/44290122/… Commented el 22 jun. 2023 a las 2:56
  • Obviamente debes hacer TODAS las validaciones de seguridad necesarias del lado del servidor, pero mi enfoque es distinto. Diría que para el usuario normal, haces todo pretty del lado del cliente. Puedes valerte de javascript y bibliotecas para sacar mensajes de error vistosos, hacer recuadros en los campos con errores, etc. Del lado del servidor haces algo más simple, como un if (!isset($_POST["tituloLibro"]) or (empty($_POST["tituloLibro"])) die("titulo requerido").
    – jachguate
    Commented el 22 jun. 2023 a las 3:02

1 respuesta 1

0

Estás mezclando en el servidor las validaciones que necesariamente tiene que hacer este (en cuanto a integridad y seguridad), con la lógica de interacción con el usuario y ofrecerle mensajes de error y ayudas para que logre completar el formulario.

Si separas esto, vas a lograr tener un código mucho más simple, tanto del lado del servidor, como del lado del cliente, pues la intención de cada uno queda totalmente clara y no se mezclan cosas que debe hacer uno con las que debe hacer el otro, que es lo que observo en el código de ejemplo que publicas en la pregunta.

Del lado del servidor, debiera bastar con el equivalente a:

if (!isset($_POST["tituloLibro"]) or (empty($_POST["tituloLibro"])) die("titulo requerido")

Del lado del cliente, puedes asegurarte que el cliente normal nunca vea este feo mensaje de error, haciendo las validaciones necesarias, que pueden ser una combinación de reglas y validaciones activas realizadas con código.

De hecho, puedes querer usar alguna biblioteca de las muchas que hay especializadas en el tema, por ejemplo, te dejo aquí un ejemplo (muy sencillo) del uso de validator.js:

const patternAutor = /^[a-zA-Z\sñáéíóúÁÉÍÓÚ]+$/;

var validator = new Validator({
  form: document.getElementById('form'),
  rules: {
    autor: {
      validate: (val) => ((val)&&(patternAutor.test(val))) ?'':'Caracteres inválidos en autor!'
    },
    email: {
      validate: (val) => val ? '' : 'Email requerido!',
    },
    password: {
      validate: (val) => (!val)||val.length<5||val.length>15?'longitud debe ser entre 5 y 15' : ''
    },
  }
});

validator.form.onsubmit = (evn) => {
  evn.preventDefault();
  const values = validator.getValues();
  if (Object.keys(validator.errorMessages).length===0) {
    console.log("todo OK", values);
  } else {
    console.log("errores: ", validator.errorMessages);
  }
}

validator.form.onreset = (evn) => {
  const data = validator.reset();
  console.log(data);
}
<script type="text/javascript">
</script>
<script src="https://cdn.statically.io/gh/jaywcjlove/validator.js/master/packages/core/dist/validator.min.js"></script>
<form id="form">
  <div>
    <label for="autor">Autor:</label>
    <input type="text" name="autor" placeholder="" required/>
  </div>
  <div>
    <label for="email">EMail:</label>
    <input type="email" name="email" placeholder="" required/>
  </div>
  <div>
    <label for="password">Contraseña:</label>
    <input type="password" name="password" />
  </div>
  <div>
    <button type="submit">Enviar</button>
    <button type="reset">Borrar</button>
  </div>
</form>

En un sistema ya preparado para producción, esto estaría, obviamente, mucho más refinado.

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.