I’m playing around with writing a jQuery plugin that uses an attribute to define form validation behavior (yes, I’m aware there’s already a validation plugin; this is as much a learning exercise as something I’ll be using). Ideally, I’d like to have something like this:
Example 1 – input:
<input id='name' type='text' v:onvalidate='return this.value.length > 0;' /> Example 2 – wrapper:
<div v:onvalidate='return $(this).find('[value]').length > 0;'> <input id='field1' type='text' /> <input id='field2' type='text' /> <input id='field3' type='text' /> </div> Example 3 – predefined:
<input id='name' type='text' v:validation='not empty' /> The goal here is to allow my jQuery code to figure out which elements need to be validated (this is already done) and still have the markup be valid XHTML, which is what I’m having a problem with. I’m fairly sure this will require a combination of both DTD and XML Schema, but I’m not really quite sure how exactly to execute.
Based on this article, I’ve created the following DTD:
<!ENTITY % XHTML1-formvalidation1 PUBLIC '-//W3C//DTD XHTML 1.1 +FormValidation 1.0//EN' 'http://new.dandoes.net/DTD/FormValidation1.dtd' > %XHTML1-formvalidation1; <!ENTITY % Inlspecial.extra '%div.qname; ' > <!ENTITY % xhmtl-model.mod SYSTEM 'formvalidation-model-1.mod' > <!ENTITY % xhtml11.dtd PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd' > %xhtml11.dtd; And here is ‘formvalidation-model-1’:
<!ATTLIST %div.qname; %onvalidation CDATA #IMPLIED %XHTML1-formvalidation1.xmlns.extra.attrib; > I’ve never done DTD before, so I’m not even really exactly sure what I’m doing. When I run my page through the W3 XHTML validator, I get 80+ errors because it’s getting duplicate definitions of all the XHTML elements. Am I at least on the right track? Any suggestions?
EDIT: I removed this section from my custom DTD, because it turned out that it was actually self-referencing, and the code I got the template from was really for combining two DTDs into one, not appending specific items to one:
<!ENTITY % XHTML1-formvalidation1 PUBLIC '-//W3C//DTD XHTML 1.1 +FormValidation 1.0//EN' 'http://new.dandoes.net/DTD/FormValidation1.dtd' > %XHTML1-formvalidation1; I also removed this, because it wasn’t validating, and didn’t seem to be doing anything:
<!ENTITY % Inlspecial.extra '%div.qname; ' > Additionally, I decided that since I’m only adding a handful of additional items, the separate files model recommended by W3 doesn’t really seem that helpful, so I’ve put everything into the dtd file, the content of which is now this:
<!ATTLIST div onvalidate CDATA #IMPLIED> <!ENTITY % xhtml11.dtd PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd' > %xhtml11.dtd; So now, I’m not getting any DTD-related validation errors, but the onvalidate attribute still is not valid.
Update: I’ve ditched the DTD and added a schema: http://schema.dandoes.net/FormValidation/1.0.xsd
Using v:onvalidate appears to validate in Visual Studio, but the W3C service still doesn’t like it.
Here’s a page where I’m using it so you can look at the source:
And here’s the link to the w3c validation result:
Is this about as close as I’ll be able to get with this, or am I still doing something wrong?
If you want the result to be valid XHTML, I believe you’ll need to use XML namespaces rather than a custom DTD. Not only does the DTD define the language (and thus, a custom DTD isn’t ‘really’ XHTML), but it will throw any browsers that read it into quirks mode, even if they don’t choke on the file.
Using a namespace, on the other hand, will produce perfectly valid XHTML (though not all validators are namespace-aware and may not validate it correctly) and allow browsers to work in (near-)standards mode.