I'm trying to cleanup my xhtml validation -- I'm running my pages through the W3C validator. For some puzzling reason it's not passing on input fields with the autocomplete="off" attribute:
<input name="kwsearch" id="sli_search_1" type="text" autocomplete="off" onfocus="if(this.defaultValue==this.value) this.value='';"
onblur="if(this.value=='')this.value=this.defaultValue;" class="searchbox" value="Search" />
I'm using this doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
And this is the validation error:
Line 410, Column 81: there is no attribute "autocomplete"
…li_search_1" type="text" autocomplete="off" onfocus="if(this.defaultValue==thi…
I thought this was okay with the W3C -- but, maybe it's still in "submission" phase? http://www.w3.org/Submission/web-forms2/#autocomplete
Thoughts?
autocomplete is a HTML5 attribute, so use a HTML5 document type declaration, if you need it.
The Web forms specification has nothing to do with HTML 4 / XHTML. Sadly,
autocomplete
will not pass validation.I think the only way to achieve valid HTML 4 /XHTML with autocomplete turned off is adding the attribute on page load using JavaScript. Sucks, I know - but I think it's the only way.
If you need autocomplete( browsers do support it ), then try extending your doctype, like in this XHTML 1.1 below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd" [ <!ATTLIST form autocomplete (on|off) #IMPLIED> ]>
I've just banged up against this irritating conflict between browsers and standards. I ended up getting around it by running javascript ON THE PAGE, not waiting for
window.onLoad
or$(document).ready()
, to add the attribute to all elements with the classno-browser-autocomplete
. Then i went through my app removingautocomplete="off"
and adding this class instead.Obviously this will fail in browser environments not running javascript.
The reason that i do it on the page, rather than in a dom ready block, is that if you wait for dom ready, the browser's already autocompleted it, at least in Firefox (which i'm testing it in).
So, this is at the start of one of the javascript files i include in my app layout:
That W3C link is for the web forms stuff, not core XHTML. It might be possible to pull in the extra DTD for the web forms and get the page to validate.