0

he creado un formulario y me gustaría que al enviarlo la alert diga: "Bienvenido, Usuario", "usuario" siendo el valor que hayamos introducido en el formulario. he probado haciendo el value del type=text en un var pero nada, no encuentro la forma. El código de la función es este:

    function valida_envia() {
        //valido el nombre
        if (document.registro.nombre.value.length == 0) {
            alert("Tiene que escribir su nombre")
            document.registro.nombre.focus()
            return 0;
        }

        //valido la fecha
        if (document.registro.fecha.value == 0) {
            alert("Seleccione su fecha de nacimiento")
            document.registro.fecha.focus()
            return 0;
        }
        //valido el mail
        if (document.registro.correo.value.length == 0) {
            alert("Tiene que escribir su Correo Electrónico")
            document.registro.correo.focus()
            return 0;
        }
        //valido la contraseña
        if (document.registro.contraseña.value.length == 0) {
            alert("Tiene que escribir su Contraseña")
            document.registro.contraseña.focus()
            return 0;
        }
        //valido el usuario
        if (document.registro.usuario.value.length == 0) {
            alert("Tiene que escribir su nombre de usuario")
            document.registro.usuario.focus()
            return 0;
        }
        //valido el servidor
        if (document.registro.servidor.value == 0) {
            alert("Seleccione un servidor de hosteo")
            document.registro.servidor.focus()
            return 0;
        }
        //el formulario se envia
        alert("Usuario creado con éxito correctamente, bienvenido");
        document.registro.submit();
    }

Y el código del html es este:

<td class="perfil">
    <p class="texto">Usuario (Entre 8 y 10 máx.)</p><br>
    <input class="caja" type="text" name="usuario" id="usuario" value="" minlength="8" maxlength="20" required /><br>
</td>

Muchas gracias.

3
  • ¿Y quieres que vaya apareciendo conforme vayas tecleando o hacerlo con un botón y que al pulsar te muestre "Bienvenido" y lo que hayas puesto en el input? Si puedes aportar el resto de tu código te podré ayudar mejor (para probarlo y poder decirte, más que nada). Commented el 17 nov. 2021 a las 10:16
  • exacto, que en la alerta final ponga bienvenido y el nombre de usuario que haya introducido anteriormente. ¿Que parte del código necesitas, el formulario entero?
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:53
  • Lo siento, acabo de ver tu comentario. Veo que lo solucionaste. Genial! Commented el 17 nov. 2021 a las 11:22

2 respuestas 2

1

Simplemente lo puedes hacer así:

let usuario = document.getElementById('usuario').value;

//el formulario se envia
alert(`Usuario creado con éxito correctamente. Bienvenido, ${usuario}.`);
5
  • he puesto la línea del let encima del comentario tal cual lo has escrito tu y el ${usuario}. sale como tal, no lo que introduzco, la fila del let va en otro lado por eso que no funcione? y el icono del dólar me da error y el paréntesis final
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:44
  • Prueba con alert('Usuario creado con éxito correctamente. Bienvenido ' + document.registro.usuario.value); sustituyendo al alert("Usuario creado con éxito correctamente, bienvenido"); del código de tu pregunta. Commented el 17 nov. 2021 a las 10:53
  • me ha funcionado perfectamente, muchísimas gracias
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:57
  • perdona que te pregunte otra vez, y si quisiera seguir poniendo texto después? habria que poner al final del +document.registro.usuario.value .value ,"_el texto que quiera_");, gracias.
    – Hugo_jim
    Commented el 17 nov. 2021 a las 11:04
  • En vez de , un + y ya estaría Commented el 17 nov. 2021 a las 11:18
0

Si pones la definición del formulario en html estará mas completa la pregunta, pero voy a aventurar una respuesta que creo que te servirá.
Supongo que tendrás un form en html del estilo

<form action="accion.php" onsubmit = "return valida_envia()" id="registro">

El script accion.php será el que procesa el formulario si onsubmit devuelve true. Lo lógico es que el mensaje aparezca después de que este script procese el formulario.
Pero si quieres hacerlo antes (también tiene su lógica) cambia este elemento y pon esto

   <form action="accion.php" onsubmit = "return valida_envia(this)">

Como ves le pones un argumento a la función de validar, este argumento es el formulario.
Y en la función cambia el acceso a los campos de document.registro.usuario.value por argumento.usuario.value. Es decir que document.registro lo cambias por el argumento de la función.
Esto:

function valida_envia(formulario){
    var usr = formulario.usuario.value;
    if(formulario.nombre.value.length ==0){
        alert("Tiene que escribir su nombre")
        document.registro.nombre.focus()
        return 0;
     }

Y luego al final puedes mantener el submit o puedes hacer un return true para que action haga su tarea y envíe el formulario (o sea que el submit de la última linea no es necesario si haces un return true).
El alert final sería alert("Usuario creado con éxito correctamente, bienvenido "+ usr);

3
  • mi línea del form es esta <form method="post" target="_self" name="registro"> y en la del boton tengo esto:<input id="btnperfil" class="btnperfil" type="button" value="Enviar" name="buscar" onclick="valida_envia()">. La parte del argumento mas o menos lo entiendo, muchas gracias
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:46
  • vale he probado a poner lo que me has dicho pero el paréntesis final de la alerta final me sale subrayado en rojo con el error "identifier expected"
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:51
  • ya he conseguido apañarlo, muchísimas gracias por la ayuda!!
    – Hugo_jim
    Commented el 17 nov. 2021 a las 10:57

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.