Use HTML5 to Require a Field- problem

Use HTML5 to Require a Field- problem
0

#1

Tell us what’s happening: Hello… I’m in trouble trying to slove this challenge… I’m being told that my text should have the required attribute and I don’t know how to do it… Thanks for your help!

Your code so far


<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>
  
  <select> <input type="text" required> </select>
  
  </form>

</main>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:62.0) Gecko/20100101 Firefox/62.0.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/


#2

You need not create another element like this, remove it and just add the required attribute to the already existing input element.

You can reset the code and do the above.


#4

thank you very very goood
دانلود فیلم دانلود فیلم ایرانی


#6

I’ve been trying to add several different attributes, but I’m not succeeding… What do you suggest? Thanks!


#7

Can you provide the code of what you have tried so far based on my previous comments ?


#8

<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"> <select>
    <button type="submit">Submit</button>
  </form>
</main>

#9
  1. Reset your code.

  2. This is the only element you need to focus on

<input type="text" placeholder="cat photo URL">

  1. Add the required attribute to that element.

#10

I’ve already reset my code… I just can’t find the right attribute to add to that element


#11
<input type="text" placeholder="cat photo URL"> <select>

Why is there a select tag here, you should remove that and add the required to the input element, that should do.


#12

Hey Charliealpha094,
Good to see you have an extra line of code written:

But for this challenge you need to do the following:
solution
Hope this helps!!


#13

Thanks a lot bharathkv!!! :slight_smile: Now I know what I was doing wrong!! Cheers!!


#14

My pleasure!! :sweat_smile:
It’s good to do mistakes while learning, which will help one to learn from it.
Happy learning!! Happy coding!!


#15

Yeah! I still have a lot to learn… I’ve only started 2 days ago, and I’m still adapting myself to this new world of coding… Step after step, I’ll reach it!! Thanks again for your help!
Happy coding for you too!