XHTML Strict and Javascript Form Validation

Discussion in 'Javascript' started by Robert Smith, Nov 30, 2004.

  1. Robert Smith

    Robert Smith Guest

    I have a very basic form validation script, which wont work due to XHTML
    Strict not allowing me to use the name attribute on a form. Here is part of
    my code:

    if (document.feedback.first_name.value == "") {
    alert ('Please enter your first name.');
    document.feedback.first_name.focus()
    return false;
    }

    So I figured I'd use the id attribute instead of the name attribute, like
    so:

    if (document.getElementById("feedback").first_name.value == "") {
    alert ('Please enter your first name.');
    document.getElementById("feedback").first_name.focus()
    return false;
    }

    which works in Mozilla, but not Internet Explorer. Internet Explorer just
    ignores it and submits an invalid form. What am I supposed to do?

    --
    -Robert Smith
    -------------------------------------------------------------------------------------------------------------
    Remove 'nospam.' from my email address if you wish to reply via email.
    Robert Smith, Nov 30, 2004
    #1
    1. Advertising

  2. Robert Smith

    RobG Guest

    Robert Smith wrote:
    > I have a very basic form validation script, which wont work due to XHTML
    > Strict not allowing me to use the name attribute on a form. Here is part of
    > my code:

    [...]

    The following works in both Firefox and IE. I tried changing the id
    attribute of the input to a name attribute and it still worked fine.
    So I guess this is one of those "can't replicate the problem" problems.

    The obvious one is that attribute names must be lower case, but I'm
    sure you'd have that covered. Here is the W3C description of the
    differences between HTML and XHTML:

    <URL:http://www.w3.org/TR/xhtml1/#diffs>

    I assume I got the doctype correct? You didn't say exactly which one
    you are using.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html><head>
    <title>XHTML test</title>
    </head><body>
    <form action="" id="feedback">
    <input type="text" id="first_name" value="rob">first name<br>
    <input type="button" value="click test" onclick="
    if(document.getElementById('feedback')) {
    alert(document.getElementById('feedback').first_name.value);
    } else {
    alert('eEBI doesn\'t work');
    }
    ">
    </form>
    </body>
    </html>

    --
    Rob
    RobG, Nov 30, 2004
    #2
    1. Advertising

  3. On Tue, 30 Nov 2004 06:45:25 GMT, RobG <> wrote:

    > Robert Smith wrote:
    >
    >> I have a very basic form validation script, which wont work due to
    >> XHTML Strict not allowing me to use the name attribute on a form. Here
    >> is part of my code:

    > [...]
    >
    > The following works in both Firefox and IE. I tried changing the
    > id attribute of the input to a name attribute and it still worked
    > fine. So I guess this is one of those "can't replicate the
    > problem" problems.


    I think you misunderstand. The name attribute is perfectly acceptable on a
    form *control*, and if you intend to submit the data that control
    contains, it *must* be specified just as must with HTML. The name
    attribute on the form element is the problem as XHTML Strict doesn't allow
    it.

    In fact, name attributes are only allowed on images, forms and links for
    backwards compatibility with old browsers like NN4 which were written
    before the introduction of the id attribute. Unless you care about them,
    the name attribute should *only* be used for form controls.

    [snip]

    > <form action="" id="feedback">


    [snip]

    > if(document.getElementById('feedback')) {


    You don't need to use getElementById. The forms collection can be
    subscripted with numbers, names, or ids. With a string subscript[1], the
    user agent will attempt to find a matching id first. Only if that fails
    will a name look-up be performed.

    document.forms['feedback'].elements['first_name']

    [snip]

    Mike


    [1] Every expression inside square brackets is treated as a string,
    including numeric literals and object references. However, if the string
    can be converted to a number, then back to a string, and still match the
    original value exactly, it is considered to be an array index, not a
    property. So:

    '10' -> 10 -> '10' '10' array index
    '05' -> 5 -> '5' '05' property name
    'fg' -> NaN -> 'NaN' 'fg' property name

    --
    Michael Winter
    Replace ".invalid" with ".uk" to reply by e-mail.
    Michael Winter, Nov 30, 2004
    #3
  4. Robert Smith

    Robert Smith Guest

    "Michael Winter" <> wrote in message
    news:eek:psh9yzed6x13kvk@atlantis...
    > On Tue, 30 Nov 2004 06:45:25 GMT, RobG <> wrote:
    >
    >> Robert Smith wrote:
    >>
    >>> I have a very basic form validation script, which wont work due to
    >>> XHTML Strict not allowing me to use the name attribute on a form. Here
    >>> is part of my code:

    >> [...]
    >>
    >> The following works in both Firefox and IE. I tried changing the
    >> id attribute of the input to a name attribute and it still worked
    >> fine. So I guess this is one of those "can't replicate the
    >> problem" problems.

    >
    > I think you misunderstand. The name attribute is perfectly acceptable on a
    > form *control*, and if you intend to submit the data that control
    > contains, it *must* be specified just as must with HTML. The name
    > attribute on the form element is the problem as XHTML Strict doesn't allow
    > it.
    >
    > In fact, name attributes are only allowed on images, forms and links for
    > backwards compatibility with old browsers like NN4 which were written
    > before the introduction of the id attribute. Unless you care about them,
    > the name attribute should *only* be used for form controls.
    >
    > [snip]
    >
    >> <form action="" id="feedback">

    >
    > [snip]
    >
    >> if(document.getElementById('feedback')) {

    >
    > You don't need to use getElementById. The forms collection can be
    > subscripted with numbers, names, or ids. With a string subscript[1], the
    > user agent will attempt to find a matching id first. Only if that fails
    > will a name look-up be performed.
    >
    > document.forms['feedback'].elements['first_name']
    >
    > [snip]
    >
    > Mike


    Thankyou, the document.forms[] way worked. I actually used

    document.forms['feedback'].first_name.focus()
    return false;

    but I can't figure out why

    document.getElementById('feedback').first_name.focus()
    return false;

    doesn't work for me. Thanks for solving my problem though :)
    Robert Smith, Dec 1, 2004
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Woolly Mittens
    Replies:
    11
    Views:
    2,307
    William Tasso
    Jan 2, 2004
  2. Replies:
    2
    Views:
    718
    cwdjrxyz
    Aug 28, 2007
  3. Sergio del Amo Caballero

    xhtml 1.0 strict with javascript

    Sergio del Amo Caballero, Oct 15, 2003, in forum: Javascript
    Replies:
    5
    Views:
    162
    Richard Hockey
    Oct 15, 2003
  4. Jonny

    Javascript with XHTML 1.0 strict?

    Jonny, Jan 23, 2004, in forum: Javascript
    Replies:
    6
    Views:
    149
    Martin Honnen
    Jan 23, 2004
  5. Paul Marsh
    Replies:
    7
    Views:
    125
    cwdjr
    Sep 19, 2004
Loading...

Share This Page