freeCodeCamp/curriculum/challenges/spanish/01-responsive-web-design/basic-html-and-html5/use-html5-to-require-a-fiel...

2.0 KiB

id title challengeType videoUrl localeTitle
bad87fee1348bd9aedc08830 Use HTML5 to Require a Field 0 Usa HTML5 para requerir un campo

Description

Puede requerir campos de formulario específicos para que su usuario no pueda enviar su formulario hasta que él o ella los haya completado. Por ejemplo, si desea hacer que un campo de entrada de texto sea obligatorio, simplemente puede agregar el atributo required dentro de su elemento de input , como este: <input type="text" required>

Instructions

Haga que su input texto sea un campo required , de modo que su usuario no pueda enviar el formulario sin completar este campo. Luego intente enviar el formulario sin ingresar ningún texto. ¿Ves cómo tu formulario HTML5 te notifica que el campo es obligatorio?

Tests

tests:
  - text: Su elemento de <code>input</code> texto debe tener el atributo <code>required</code> .
    testString: 'assert($("input").prop("required"), "Your text <code>input</code> element should have the <code>required</code> attribute.");'

Challenge Seed

<h2>CatPhotoApp</h2>
<main>
  <p>Click here to view more <a href="#">cat photos</a>.</p>

  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
  <form action="/submit-cat-photo">
    <input type="text" placeholder="cat photo URL">
    <button type="submit">Submit</button>
  </form>
</main>

Solution

// solution required