Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Ranish Malhan
Ranish Malhan
Courses Plus Student 37 Points

W3C validation error The form attribute must refer to a form element

I am getting a w3c validation error The form attribute must refer to a form element. How to solve this problem? Please help I am putting my form code below

<div class="modal fade" id="signup_form" tabindex="-1" role="dialog" aria-labelledby="signin_form" aria-hidden="true"> <div class="modal-dialog" id="signupform_dialog"> <div class="modal-content"> <div class="modal-header" id="signup_form_header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h3 class="modal-title" id="signup_form_Label">Sign up</h3> <!-- <p>Welcome back. Login and save ur precious money.</p>--> </div> <form id="sign_up_form"> <div class="modal-body" id="Signup_body"> <label>E-mail</label><br> <input name="Email" type="email" required id="signup_Email" form="signup_form" placeholder="enter your email" title="Email"><br><br> <label>Password</label><br> <input type="password" required form="signup_form" placeholder="enter your password"><br><br>

        <label>Repeat Password</label><br>
        <input type="password" required form="signup_form" placeholder="enter your password"><br><br>


    </div>
    <div class="modal-footer">
        <input type="submit" form="signup_form" value="Signup">
      <a>Signup</a>
      <a>Forget password</a>
    </div>
  </form>
</div>

</div> </div>

1 Answer

Damien Watson
Damien Watson
27,419 Points

Hi Ranish, Your form elements have a 'form' attribute in them that is not required. If you remove these, the errors will go away. Form elements also require a name to define them, so it is best to add this into the form and input fields.

  <form name="sign_up_form" id="sign_up_form">
    <div class="modal-body" id="Signup_body">
        <label>E-mail</label><br>
        <input name="Email" type="email" required id="signup_Email" placeholder="enter your email" title="Email"><br><br>

        <label>Password</label><br>
        <input name="Password" type="password" required placeholder="enter your password"><br><br>

        <label>Repeat Password</label><br>
        <input name="confirmPassword" type="password" required placeholder="enter your password"><br><br>
    </div>
    <div class="modal-footer">
        <input name="submit" type="submit" value="Signup">
      <a>Signup</a>
      <a>Forget password</a>
    </div>
  </form>
Ranish Malhan
Ranish Malhan
Courses Plus Student 37 Points

It works Many many thanks Damien