Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

[Duda] Required no funciona en mi código

Hola! Cuando puse required e hice prueba en la página, no me aparecieron las advertencias de que no había completado el campo. Reviso en las herramientas de desarrollador y no me marca ningún error. Si pudieran ayudarme, se los agradezco. Pongo aquí mi código:

<head>

    <meta charset="UTF-8">
    <title>Contacto - Barbería Alura</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="style.css">

</head>

<body>
    <header>
        <div class="caja">
            <h1><img src="imagenes/logo.png"></h1>
            <nav>
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="Servicios.html">Servicios</a></li>
                    <li><a href="contacto.html">contacto</a></li>
                </ul>
            </nav>
        </div>

    </header>

    <main>
        <form>
            <label for="nombreyapellido">Nombre y apellido</label>
            <input type="text" id="nombreyapellido" class="input-padron" required>

            <label for="correoelectronico">Correo electrónico</label>
            <input type="email" id="correoelectronico" class="input-padron" required placeholder="email@dominio.com">

            <label for="telefono">Teléfono</label>
            <input type="tel" id="telefono" class="input-padron" required placeholder="(XX) XXXX XXXX">

            <label for="mensaje">Escriba aquí sus dudas, quejas o comentarios</label>
            <textarea cols="68" rows="10" id="mensaje" class="input-padron" required></textarea>

            <div>
                <p class="test" id="test">¿Cómo te gustaría que te contactemos?</p>

                <label for="radio/email"><input type="radio" name="contacto" value="email" id="radio-email">Email</label>

                <label for="radio/telefono"><input type="radio" name="contacto" value="telefono" id="radio-telefono">Teléfono</label>

                <label for="radio/whatsapp"><input type="radio" name="contacto" value="whatsapp" id="radio-whatsapp" checked>WhatsApp</label>

            </div>

            <div>
                <p>¿En cuál horario prefieres ser atendido?</p>
                <select>
                    <option>Mañana</option>
                    <option>Tarde</option>
                    <option>Noche</option>
                </select>
            </div>

            <label class="checkbox"><input type="checkbox" checked>¿Te gustaría recibir novedades de la Barbería Alura?</label>

            <input type="submit" value="Enviar formulario"

        </form>

    </main>



    <footer>
        <img src="imagenes/logo-blanco.png">
        <p class="copyright">&copy Copyright Barbería Alura - 2020</p>


    </footer>
</body>
2 respuestas
solución!

Hola Eva! Me parece que te faltó cerrar el último input antes de cerrar el form:

<input type="submit" value="Enviar formulario"

Si le agregas el '>' al final creo que te debería funcionar. De igual manera yo siempre pongo el 'required' al final de la etiqueta antes de cerrarla ya que creo que se lee mejor, así:

<input type="email" id="correoelectronico" class="input-padron" placeholder="email@dominio.com" required>

Hola, Brenda! En efecto, el error estaba en que no cerré el input. Muchas gracias!