Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts

    Validation errors not understood

    Hello

    I am getting a few errors/warnings from the FREE HTML & CSS Validation Service - OnlineWebCheck.com validator. They are:

    Bad reference. The "Username" ID reference for this "label" tag appears to reference a nonexistent labelable element. NOTE: IDs are treated
    as being case-sensitive and "input" elements with type="hidden" are not labelable.
    This relates to the following line in my script:

    Code:
    <fieldset>
    <label for="UserID">Username</label>
    <input type="text" name="UserID" id="UserID" />
    </fieldset>
    I have not used "Username" for the <label> tag, however, I have used 'UserID'.

    Likewise:

    Bad reference. The "password" ID reference for this "label" tag appears to reference a nonexistent labelable element. NOTE: IDs
    are treated as being case-sensitive and "input" elements with type="hidden" are not labelable.
    This relates to the following line in my script:

    Code:
    <fieldset>
    <label for="Password">Password</label>
    <input type="Password" name="Password" id="Password" />
    </fieldset>
    I am not sure what is wrong giving a label the name 'Password'? In fact, I have used Password with a capital 'P' and not a small 'p' as the validator indicates.

    Then there is the validator's
    The control name "Password" has already been used in this form and should not be used in this "input" tag".
    This relates to the following line in my script:

    Code:
    <input type="submit" name="Login" id="Login" value="Login" />
    I have not used 'Password' here; I have used 'Login'.

    Finally, there is the validator's
    An "input" element with type="checkbox" should normally have both the "name" and "value"
    attributes even though this is not technically required by the HTML/XHTML specification.
    In my script I have:

    Code:
    <label for="checkbox"><input type="checkbox" id="checkbox" name="checkbox" value="checkbox"  />Remember me</label></fieldset>
    My URL is here: bayingWolf loginand I would be grateful if anyone could shed light on these errors and any way of tidying them up.

    Thanks.

    Blue

  • #2
    Regular Coder
    Join Date
    Jan 2013
    Location
    Sunnyvale, CA
    Posts
    115
    Thanks
    8
    Thanked 7 Times in 7 Posts
    You might want to read the validator's documentation.

    I do not have an answer for you, but one thing that you might try is nesting your input control within its label. W3 documentation does present it as an option, and I am simply wondering if the validator will process it correctly when nested.

    Have you considered writing your own validation routines?

  • Users who have thanked sbhmf for this post:

    Blue1 (03-30-2014)

  • #3
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Are you validating as HTML or as XHTML. If HTML then the invalid / in front of the > on the input tags may be causing the confusion. If as XHTML then the space before those / are unneeded but should not be causing those errors.

    Have you tried validating your page using the w3c validator? The error may be that the validator you are using does not correctly follow the standards.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    Blue1 (03-30-2014)

  • #4
    New Coder
    Join Date
    Dec 2011
    Posts
    87
    Thanks
    5
    Thanked 14 Times in 14 Posts
    I think it should be this for the last code box:
    Code:
    <fieldset>
      <label for="checkbox">Remember me</label>
      <input type="checkbox" id="checkbox" name="checkbox" value="checkbox"  />
    </fieldset>
    or

    Code:
    <fieldset>
      <input type="checkbox" id="checkbox" name="checkbox" value="checkbox"  />
      <label for="checkbox">Remember me</label>
    </fieldset>
    Depending on the look you want.
    True courage is about knowing not when to take a life, but when to spare one. PDO Tutorial

  • Users who have thanked Strider64 for this post:

    Blue1 (03-30-2014)

  • #5
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Have you considered writing your own validation routines?
    I probably wouldn't know how to do that, sbhmf, but maybe it's worth some research to find out more.

    Thanks for your reply.

  • #6
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Hello Felgall

    This is what I have in my page:

    [code]<!DOCTYPE html>

    <html lang="en">

    <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <meta charset="utf-8">

    .....meta tags here

    </head></code>

    I'll try the W3 validation as you suggest. Thanks!

  • #7
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Hello Strider64

    Either of those scripts pull the 'Remember Me' checkbox right up against the 'Log-in Button' - you couldn't fit a cigarette paper them!

    Thanks for your reply.

    Blueie

  • #8
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by Blue1 View Post
    Code:
    <!DOCTYPE html>
    With that as the doctype you'd need to tell the validator which version of HTML to validate as since that one is valid for all versions of HTML 2 through 5 as well as XHTML 1.0. The only versions that doctype identifies that the page is not are HTML 1 or XHTML 5 (neither of which have a doctype tag in the page).
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #9
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Hello felgall

    I thought it was HTML 5?

    For those of you who aren’t familiar with the HTML5 DOCTYPE, it looks like this: <!DOCTYPE html>
    That's what it says here, anyway: John Resig - HTML5 DOCTYPE

    What I am not too sure about is whether or not HTML5 takes this:
    <input type="text" name="UserID" id="UserID" />
    or this
    <input type="text" name="UserID" id="UserID"/>
    That is, no space at the end.

  • #10
    Regular Coder
    Join Date
    Jan 2013
    Location
    Sunnyvale, CA
    Posts
    115
    Thanks
    8
    Thanked 7 Times in 7 Posts
    Hi Blue1,

    In HTML5, input tags do not require that a forward slash precede the closing of a childless tag. Hence your

    Code:
    <input type="text" name="UserID" id="UserID"/>
    in HTML5 should be

    Code:
    <input type="text" name="UserID" id="UserID">
    The slash that precedes childless closing tags is only used when the code must comply with XML, and therefore is required in XHTML, which put simply is XML's implementation of HTML.

    Hope you're not so blue anymore

  • Users who have thanked sbhmf for this post:

    Blue1 (04-01-2014)

  • #11
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Hello sbhmf

    Thanks for that - another day another lesson!

    Cheers

  • #12
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    XHTML5 uses <input type="text" name="UserID" id="UserID"/>

    The space was only needed before the / when serving the page as HTML in Netscape 4. You can serve the file as HTML to all browsers more modern than that without the space.

    The / is essential if you are serving the page as XHTML (but then the page will not display in IE8 or earlier as those browsers don't understand XHTML).

    As soon as IE8 is dead serving pages as XHTML will become practical

    XHTML 1.0 is HTML 4.0 rewritten to comply with XML while XHTML5 was developed alongside HTML5 as the next version.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    Blue1 (04-01-2014)

  • #13
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Many thanks for your explanation, felgall.

    I'll search online for a chart as to what complies with which browser and version of that browser.

    Who said astrophysics was difficult?

    Cheers again.

  • #14
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by Blue1 View Post
    Many thanks for your explanation, felgall.

    I'll search online for a chart as to what complies with which browser and version of that browser.
    HTML works with all browsers - the MIME type for HTML is text/html

    XHTML works with all modern browsers bincluding IE9+ - the MIME type for XHTML is application/xhtml+xml

    The current HTML standard released in 1997 is HTML 4.0

    The current XHTML standard is XHTML 1.0

    These are expected to be replaced by the new (X)HTML 5 standard in the next year or two.

    Most modern browsers support much of what is currently proposed for (X)HTML 5 but there could be further changes before the standard is officially adopted. Microsoft released IE5 before the CSS 2 standard was adopted supporting much of what was in that poposed standard at the time and there were significant changes in the standard by the time it was adopted - this resulted in Microsoft needing a way to distinguish between pages that followed what was in the proposal when IE5 was released from pages that followed the actual standard - hence making use of the <doctype> tag as a switch. HTML 5 retains the doctype tag for this purpose but has discarded its original purpose of defining the language definition in accordance with the SGML standard. As XHTML only supports the actual CSS standard this means that the <doctype> tag is obsolete in XHTML 5.

    It remains to be seen as to what changes will be made for the final (X)HTML 5 standard that browsers have already implemented differently - one example that has already occurred is the <hgroup> tag which was a proposed new tag for a long while before eventually being dropped as unnecessary. Other unnecessary tags may also be dropped from the final standard (although there are a lot of web pages still using long dead tags such as <iframe> and <embed> because they are still trying to cater for the two or three Netscape 4 and IE6 users).
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #15
    Regular Coder
    Join Date
    Feb 2014
    Posts
    146
    Thanks
    36
    Thanked 0 Times in 0 Posts
    Thanks for that felgall.

    Yes, I have come across pages even today that use:

    Code:
    <TABLE WIDTH="80%" BORDER="0" CELLSPACING="0" CELLPADDING="1" ALIGN="center" style="border-style: solid; border-color: #0000CC">
              <TR> 
                <TD BGCOLOR="#0000FF" CLASS="hea" HEIGHT="20"> 
                  <DIV ALIGN="center"><font face="Verdana,Arial" color="#ffffff"><b>Registered User</b></font></DIV>
                </TD>
              </TR>
    Old habits die hard!


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •