freeCodeCamp/add-an-accessible-date-picker.spanish.md at c2f57c25c5cd0c61fe451a57f6e1404cf1e7dc71

Files

Sebastian Alcantara c2f57c25c5 Improved import-a-google-font.spanish.md translation just a little bit (#22934 )

I made little improvements to the spanish translation. For instance, in "el campo de <code>input<code>" doesn't require the word "de".
Rearranged some words positioning so that the text reads more naturally.

2019-02-08 14:01:56 +01:00

3.3 KiB

Raw Blame History

id, title, challengeType, videoUrl, localeTitle

id	title	challengeType	videoUrl	localeTitle
587d778b367417b2b2512aa8	Add an Accessible Date Picker	0		Añadir un selector de fecha accesible

Description

Los formularios a menudo incluyen el campo input , que se puede usar para crear varios controles de formulario diferentes. El atributo type en este elemento indica qué tipo de entrada se creará. Puede haber notado los tipos de entrada text y submit en desafíos anteriores, y HTML5 introdujo una opción para especificar un campo date . Dependiendo de la compatibilidad del navegador, aparece un selector de fecha en el campo input cuando se lo enfoca, lo que facilita el llenado del formulario para todos los usuarios. Para los navegadores más antiguos, se asigna por defecto el tipo text, de forma tal que ayude a mostrar a los usuarios el formato de fecha esperado en la etiqueta o como texto "placeholder", por si acaso. Aquí hay un ejemplo:

<label for = "input1"> Ingrese una fecha: </label>
<input type = "date" id = "input1" name = "input1">

Instructions

Camper Cat está organizando un torneo de Mortal Kombat y quiere preguntar a sus competidores qué fecha resulta mas conveniente. Agregue una etiqueta de input con un atributo de type de "fecha", un atributo de id de "pickdate" y un atributo de name de "fecha".

Tests

tests:
  - text: Su código debe agregar una etiqueta de <code>input</code> para el campo selector de fecha.
    testString: 'assert($("input").length == 2, "Your code should add one <code>input</code> tag for the date selector field.");'
  - text: Su etiqueta de <code>input</code> debe tener un atributo de <code>type</code> con un valor de fecha.
    testString: 'assert($("input").attr("type") == "date", "Your <code>input</code> tag should have a <code>type</code> attribute with a value of date.");'
  - text: Su etiqueta de <code>input</code> debe tener un atributo <code>id</code> con un valor de pickdate.
    testString: 'assert($("input").attr("id") == "pickdate", "Your <code>input</code> tag should have an <code>id</code> attribute with a value of pickdate.");'
  - text: Su etiqueta de <code>input</code> debe tener un atributo de <code>name</code> con un valor de fecha.
    testString: 'assert($("input").attr("name") == "date", "Your <code>input</code> tag should have a <code>name</code> attribute with a value of date.");'

Challenge Seed

<body>
  <header>
    <h1>Tournaments</h1>
  </header>
  <main>
    <section>
      <h2>Mortal Kombat Tournament Survey</h2>
      <form>
        <p>Tell us the best date for the competition</p>
        <label for="pickdate">Preferred Date:</label>

        <!-- Add your code below this line -->



        <!-- Add your code above this line -->

        <input type="submit" name="submit" value="Submit">
      </form>
    </section>
  </main>
  <footer>&copy; 2018 Camper Cat</footer>
</body>

Solution

// solution required

3.3 KiB Raw Blame History