[DHTML] Form Validation Framework

1) CODE TITLE: Form Validation Framework

2) AUTHOR NAME/NOTES:
SynapticPath

3) DESCRIPTION:
Extensible Form Validation framework that can be easily localized.

Currently it contains validators for:
Dates
Integers
Decimals
AlphaNumeric strings
Alphabetic strings
Required fields
Strings agains regular expressions
Strings by length
Emails

Code example :

HTML Code:

---

<!-- Create xml data island that configures a validator, this one will validate onblur-->
<xml id="decimalvaldef1" style="display:none;" for="decimalfield" vblur="true">

        <!-- Default error message can be overridden/localized -->
        <converter name="decimal">Decimal field is invalid!</converter>
        <validator name="decimal" l="15.25" g="6.5"></validator>
</xml>

<!-- Instantiate event handlers-->
<script type="text/javascript">
        //Validator agent reads the validator configuration and invokes validation for specified field
        jsxBehavior("jsx.behaviors.validation.ValidationAgent", "decimalvaldef1");
</script>

---

Optionally we can instantiate MessageHandler for the entire form that shows localized validation error messages

HTML Code:

---

<!-- An element whose id matches "inputid_message" receives that input's validation errros.-->
<span id="inputid_message" for="decimalfield"></span>

<script type="text/javascript">
        //MessageHandler listens to validationError events and outputs the messages to error area defined above
        jsxBehavior("jsx.behaviors.validation.MessageHandler", "decimalform");
</script>

---

4) URL TO CODE:
Example and instructions can be found :
http://synapticpath.dyndns.org:8080/...validation.jsf

or, ATTACHED BELOW (see #3 in guidelines below):

It's a very good idea (one I've been thinking of doing myself for a while, actually) but poorly implemented here. Using your script requires invalid tags, invalid attributes on valid tags, and intrusive Javascript. It also breaks in Konqueror (as, in fact, does your entire demo page; neither the little "tabs" setup at the top nor the sidebar degrade properly).

Hey! I tried the demo and really liked what I saw. The code is amazingly clean and simple with good support for basic data-types and with Regex support you can basically validate against anything imaginable!

What is this licensed under?

The same license as the rest of the DynamicDrive scripts, should it be accepted.

Quote:

---

Important: By submitting, you represent that you are the original creator of the script, and grant Dynamic Drive the full right to include and feature your script in our script archive and possibly through other sources affiliated with Dynamic Drive. We also reserve the right to modify or remove the script from our site at any time.

---

The tool has been tested against major browser IE6+ Firefox, Mozilla, Opera. When it comes to javascript, standards were strictly observed.

When it comes to non-html tags, you'll notice that they are inside the xml data island and should therefore be ok.

I am eager to find out whether some kind of standard exists when dealing with non standard attributes like for attribute inside a span tag.

Using namespaces?
Use standard tags? - I am apalled when I see people use the class attribute to store extra information for which they were never intended for.

Quote:

---

The tool has been tested against major browser IE6+ Firefox, Mozilla, Opera. When it comes to javascript, standards were strictly observed.

---

Not strictly enough, evidently. If it breaks in Konqueror, it'll almost certainly break in Safari too. I suggest you download a copy of one of these browsers (or Swift, if you run Windows) for testing.

Quote:

---

When it comes to non-html tags, you'll notice that they are inside the xml data island and should therefore be ok.

---

XML data islands are IE-only. In other browsers, it should be ignored; however, the standards are vague on whether unknown tags should be left in the DOM tree or not. My guess is that KHTML strips them away, while Mozilla's Gecko and Opera's Presto don't. It's invalid either way.

Quote:

---

I am eager to find out whether some kind of standard exists when dealing with non standard attributes like for attribute inside a span tag.

---

Yes, if I remember correctly: as with non-standard tags, they should be ignored.

Quote:

---

Using namespaces?

---

That would only work in XHTML, which would stop IE from rendering the page.

Quote:

---

Use standard tags? - I am apalled when I see people use the class attribute to store extra information for which they were never intended for.

---

I don't see why -- it's a slight abuse of semantics, certainly, but indubitably better than making up invalid tags or attributes.

Well, that wasn't much help.

It seems that valid HTML is very important to you, and DD, perhaps that is why this forum doesn't have valid HTML either?

I've created the validation tool to help with prevailing problem and that is to provide a stable validation platform that provides validation of html forms.
It has been tested to work on most browsers that are considered standard. It has been tested to work in quirks as well as standards modes. 99% of incoming trafic that will use this validation tool will find that it works. period.

I hope that those of us that need to get a job done will find that it is quite useful.

Cheers

Quote:

---

It seems that valid HTML is very important to you, and DD, perhaps that is why this forum doesn't have valid HTML either?

---

Invalid HTML isn't HTML at all, it's nonsense. HTML nowadays is defined by the DTD specified. I had nothing to do with the construction of this forum or site; had I, I would most certainly have paid more attention to standards.

Quote:

---

I've created the validation tool to help with prevailing problem and that is to provide a stable validation platform that provides validation of html forms.

---

All well and good, except for the "stable" qualifier.

Quote:

---

It has been tested to work on most browsers that are considered standard. It has been tested to work in quirks as well as standards modes. 99% of incoming trafic that will use this validation tool will find that it works. period.

---

It's impossible to accurately test in quirks mode unless one attempts to try every browser in existence. By definition, quirks mode is not governed by standards; thus, there is no other way to ensure a sufficiently cross-browser script other than by testing in every possible current or future browser. This is why standards are important. Your 99% is a gross over-estimate: I would say 95% at the most. The majority of Mac users (estimated 5% of desktop users last I checked) will run Safari, since IE5 is broken and doesn't display many of today's sites correctly; then there are a significant portion (but not a majority) of Linux users, also around 5% last I knew; then we have a smattering of other UNIX-like systems on which KDE will run.

Quote:

---

I hope that those of us that need to get a job done will find that it is quite useful.

---

I can see it being useful on poorly-designed sites (as I said, it's a good concept), but not nearly as useful as it could be with better standards compliance.

(Using FF 1.0.7 on Windows)

I'm not sure what the script is supposed to do. Every time I hit a submit button, the page reloads with the default values. When I enter values into Onblur, nothing happens when I blur. For example, typing in "9gg" into Integers does nothing when blurring. Nothing happens with on keypress too.

Maybe I'm just not using it right, but if so, then I would say the entire UI is counter intuitive and confusing. But I think its a bug instead.

Also, the page lags quite long when it initializes all the JS stuff when the page loads. Very annoying.

Oh, and the About and Demo tabs don't work too.

I got 11 errors showing up in my JS console saying:

Code:

---

Error: eval.call is not a function
Source File: http://synapticpath.dyndns.org:8080/JSXShowcase/jsx/core.jsx
Line: 109

---

Fails to work in my IE 6 too. Tabs still don't work, but they now have a "dipping" animation when clicked.

Here's the error message:

Code:

---

Line: 223
Char: 4
Code: 0
URL: http://synapticpath.dyndns.org:8080/JSXShowcase/form/validation.jsf

---