If you’re looking for XHTML 1.1 compatibility, then only minor changes are needed to your default Movable Type templates. I had the most difficulty with the comments form on the individual entry archive.
The first thing that got me was the form itself. The form tags need to be outside of your block – for instance, form, then div. Close your /div, then close the /form. If you don’t do this, then the validator won’t read your block correctly – it will throw all sorts of errors, mostly having to do with disallowed elements.
It will also make you think that “name” isn’t a valid attribute. Indeed, you can see in this reference that name is a valid attribute for the input element. But it has to be inside that block, so get the container tags correct!
The second thing that got me was that name is not a valid attribute for the form element. Change that to “id”. Important tip: do not change any other elements from name to id – just leave ’em alone or you’ll break something else.
The final piece of the puzzle was the Javascript that handles the setting of the cookie. Because name is not a valid attribute for the form element, the default Javascript code won’t work, since it references the form by it’s name. Instead, you need to go after the elements in the form by their id instead. The id attribute must be unique in the document, so this should be fine.
I found a piece of code from the Plat that did the job. Here it is in case you’re in need.
<script type=”text/javascript”>
<!–
document.getElementById(’email’).value = getCookie(“mtcmtmail”);
document.getElementById(‘author’).value = getCookie(“mtcmtauth”);
document.getElementById(‘url’).value = getCookie(“mtcmthome”);
if (getCookie(“mtcmtauth”)) {
document.getElementById(‘remember’).checked = true;
} else {
document.getElementById(‘forget’).checked = true;
}
//–>
</script>
One note about this code that could trip you up. The “remember” function is looking for an element with an id of “remember”. This is a problem because the default id of that element is “bakecookie”. I changed that value in the Javascript to “bakecookie” and it seems to work fine.
This reminds me of another potential issue – if you change (or remove) the name value on the radio buttons, they might not work as a team. If the radio buttons do not share the same “name”, they won’t work in conjunction with one another, so you can’t select the “yes” value, which pretty much defeats the purpose of having the whole “remember me” function.
If your form suddenly stops responding on one of the radio buttons, this is the place to check – make sure that all of your “joined” buttons share the same name attribute. They should have different id attributes, but the name should be the same!
So, just change the id of the “remember” function in the code to match the id of the button, and you should be set. Recompile your templates and you should have a functional comments form that validates as XHTML 1.1.
Comments
40 responses to “Forms in XHTML 1.1”
Thanks for the info on the form-before-div! You solved my problem when the validator was less than helpful with the error messages
I spent a lot of time today cleaning up my site for 1.1 and then I realized I had to do the damn form in MT. This’ll help, but I sure don’t want to do it.
Thanks!
THANKS!
Thanks, a google search threw up this page, I am doing coursework at uni and I tried everything to get my webpage to validate in Strict xhtml, it kept throwing out errors for nearly every element between the tags. Our lecturers notes don’t mention anything about it nor does my xhtml book, the W3C validator doesn’t help much either because it doesn’t give you any explanation why you need the extra tags.
Great tips! Stay focused and determined. Don’t forget about the small things… Check to make sure all your tags are LOWERCASE!!
Thank you so much! I just changed div/form to form/div and it is valid now!
Wow, it’s really a great article! I’ve never seen something like this, talking about an important point for a developer who starts using XHTML 1.1
Your article gave me the exactly answer I was searching for.
Thanks!
Thank God for this article. Been struggling for days to get the forms pages XHTML 1.0 strict validated. Works like a charm.
Thanks a mil! -Steven
Just wanted to say thanks. We’re moving to XHTML strict, and most of the web seemed to not cover these little details. You saved me a lot of time.
Great Job! Thanks for your good work. That works fine for the validator. Saved a lot of my time, dude!