Form Doesn't Validate as Strict XHTML

just ran out of ideas

[adder]

Hi, I've been trying to validate a simple form for three hours now. All my efforts fail. It keeps saying "document type does not allow element "form" here; missing one of "object", "ins", "del", "map" start-tag." Then I am not allowed to use labels and input tags.

Obviously I am not allowed to use forms in XHTML - here we have the progress! I'm loving it!

<div id="form"><p>
<form id="form1" method="post" action="http://whatever.com/actions?id=whatever">
<label>Name:<br /><input type="text" name="Name" size="20" /></label>
<label>Email:<br /><input type="text" name="email" size="20" /></label>
<label>Your Message (required):<br /><textarea cols="20" rows="50" name="message"></textarea></label>
<input type="submit" value="Send Comment" /><input type="reset" value="Clear" />
<!-- tracker -->
<input type="hidden" name="tracker" value="whatever" />
</form></p></div>

I would be very grateful for any help!

[BlobFisk]

Have you tried removing hte <p> that you have nested your form in?

[adder]

Thank you for your reply.
Yes I have tried to move, remove, shift, ditch, etc the <p> tag. Actually, if I remove it, I have more errors in the validation message.

[SuzyUK]

to the HTML specs for you ;)

when trying to validate XHTML you have to follow them to the letter

the <p> element needs to go as Blobfisk says, because you can't nest block elements inside a <p> element [w3.org]

<!ELEMENT P - O (%inline;)* -- paragraph -->

translates to the <p> element
(-) = start tag required
(0) = end tag optional, (though this is not the case for XHTML which states that all elements must be closed)
(%inline) can only contain inline elements

your <form> is a block level element, so it can't go in the <p>

then to the form element [w3.org]

<!ELEMENT FORM - - (%block;¦SCRIPT)+ -(FORM) -- interactive form -->

translation:
<form> element, (-)start tag required, (-)end tag required

(%block;¦SCRIPT)+ = can only contain one or more block level elements or script elements (in any order)

-(FORM) = must not include another <form> element

so it can't directly contain the inputs and labels as they are not block level elements

so you need to nest a block level element inside the Form element, one which can contain your inline elements, you could simply use a div inside the form, or fieldset [w3.org]might be a better choice, as it id design to contain form elements it's definition:

<!ELEMENT FIELDSET - - (#PCDATA,LEGEND,(%flow;)*) -- form control group -->

Fieldset, start tag required, end tag required

(#PCDATA,LEGEND,(%flow;)*) = can contain text, entities, the legend element and flow element, zero or more times..
flow elements are either block or inline level elements

so your nesting would look something like

<div>
<form>
<fieldset>
<label><input>
</fieldset>
</form>
</div>

or you could replace the fieldset with another div instead..

[Receptional Andy]

Form labels and inputs need to be inside an appropriate container. For forms, the most appropriate container is almost always a fieldset:

<div id="form">
<form id="form1" method="post" action="http://example.com/actions?id=whatever">
<fieldset>
<label>Name:<br /><input type="text" name="Name" size="20" /></label>
<label>Email:<br /><input type="text" name="email" size="20" /></label>
<label>Your Message (required):<br /><textarea cols="20" rows="50" name="message"></textarea></label>
<input type="submit" value="Send Comment" /><input type="reset" value="Clear" />
<!-- tracker -->
<input type="hidden" name="tracker" value="whatever" />
</fieldset>
</form></div>

Edit: beat me to it, Suzy! (with a much better response too)

[edited by: Receptional_Andy at 12:35 pm (utc) on July 10, 2008]

[adder]

SuzyUK, you are not a webmaster, you are a scientist! Way to go!
Andy, thank you.

It now validates OK.

[SuzyUK]

You're Welcome, adder
and at least Andy & I both agreed with the fieldset :)

>>scientist
nahh.. I think some would say 'sad' though ;)

[lavazza]

<legend = "SuzyUK"/>