3.0 KiB
3.0 KiB
id, title, challengeType, videoUrl, forumTopicId, localeTitle
id | title | challengeType | videoUrl | forumTopicId | localeTitle |
---|---|---|---|---|---|
bad87fee1348bd9aedd08830 | Add a Submit Button to a Form | 0 | https://scrimba.com/p/pVMPUv/cp2Nkhz | 16627 | Добавить кнопку отправки в форму |
Description
submit
в вашу форму. Нажатие этой кнопки отправит данные из вашей формы по URL-адресу, указанному вами с помощью атрибута формы action
. Вот пример кнопки отправки: <button type="submit">this button submits the form</button>
Instructions
form
с типом submit
и «Отправить» в качестве текста.
Tests
tests:
- text: Your form should have a button inside it.
testString: assert($("form").children("button").length > 0);
- text: Your submit button should have the attribute <code>type</code> set to <code>submit</code>.
testString: assert($("button").attr("type") === "submit");
- text: Your submit button should only have the text "Submit".
testString: assert($("button").text().match(/^\s*submit\s*$/gi));
- text: Make sure your <code>button</code> element has a closing tag.
testString: assert(code.match(/<\/button>/g) && code.match(/<button/g) && code.match(/<\/button>/g).length === code.match(/<button/g).length);
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="https://freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL">
</form>
</main>
Solution
<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="https://freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL">
<button type="submit">Submit</button>
</form>
</main>