logo

Form Validator R3.0 [ROUGH CUT]

Forms are as much a part of the web now as are normal text pages, often created by these forms.... expand!

Using The Code 

Using the code is simple. That's the whole idea behind it. You don't really need any JavaScript knowledge to be able to use the approach described here, although it might help in understanding how the list of required fields is compiled.

First thing you need to do is copy the required JavaScript Libraries/files to your database. These are prototype.js and effects.js, which are stored as Files in the example database, along with global.js and validation.js, which are stored in Script Library objects.

Once these are there you need to import them in the form to be validated's header. See the form called Contact in the example database to see how.

Now we need to setup the form to use the Validator object. To do this we initialise it when the page loads, by calling the init() method in the onload event, by adding code like this to the Form's HTML Body Attributes:

@If(@IsDocBeingEdited; 
"onload=\"Validator.init( '_Contact', 'beforeForm')\""; "") 

We pass two arguments to the init method. The first is the name of the form we're validating. In most cases this is simply the actual name of your Form preceded with an underscrore. If you're not sure of the name or you know it's the only form on the page you can simply pass 0 as this paramater, like so: 

@If(@IsDocBeingEdited; 
"onload=\"Validator.init( 0 , 'beforeForm')\""; "") 

The second paramater passed is the ID of the object on the page after which you want to insert the message that validation has failed.

In the image above the message has been inserted after the two buttons, which are in a P with the id "beforeForm".

In the onsubmit event of the Form you need to tell it to call the validate() method and return the result (true/false) to the calling object.

return Validator.validate()

You now have all you need to run validation on your form. All you need to do is tell the Validator which field need validating. To do this you build an array called "fields" and add it to the Validator object. To create an the array which belongs to the Validator is as simple as this:

Validator.fields=[]

The array is empty though and not much use. We need to add something to it. Here's how we'd tell it to validate two fields:

Validator.fields=
[
{name: "FirstName"},
{name: "LastName"}
]

This is about as basic as it gets. When the Validator's validate() method is called it loops through each member of the fields array and tests their values. In this case it simply checks if either of the two fields are blank. If they are the default message "This field is required" is shown next to the field. If you don't want this message you can override for any particualy field like this

Validator.fields= 
[
{name: "FirstName"},
{name: "LastName", message: "Come on, don't be shy!"}
]

Each entry in the fields array contained within the {} brackets is known as an associative array, to which we pass a set of key:value pairs. The only pair required is the field name. Other are optional and are listed here:

NameValue(s)Description
nameStringName of the field that you want to validate. This is the name of the actual field on the form, rather than its label, and is case-sensitive. Required.
typedate
email
number
regex
custom
What kind of field it is. Used mainly with plain text fields. Whethers it a dropdown, checkbox or radiobutton etc can be worked out automatically by the script.
messageString objectIf you're not happy with the default message you can supply your own.
condition
JavaScript expression
Use this to only validate the field under certain conditions. The expression should return true of false. If true the field gets validation and vice-versa.
patternRegExp objectUsed with regex type fields.
min/max
Number or Date objectUsed with date/number type fields.
expressionJavaScript expressionFor use with custom field types. The expression should be the name of a function to call. This function can do whatever you like as long as it return eithers true or false. True if the field validates and false if not.
testFunction objectIf you supply this paramater then the Validator uses this function to validate the field instead of its own logic.

 

Advanced options: 

Here's how some of the other fields from the Contact demo form are setup for validation. Note the different combination of options used for each one.

Here we add a field that needs a valid email address entered. 

{name: "email", type: "email"} 

In the above field we should probably have added a custom message to alert the user to the fact this field must be a valid address. Otherwise there may be confusion. Like in the following field, where we require a certain format for a phone number, so we specify this in the error message to help the user. We specify the format by making the field a regex type and passing it a pattern to match, as shown: 

{
name
: "Phone",
type: "regex",
pattern: /^\+\s\d{2}\s\d{3}\s\d{4}$/,
message: "Please enter a phone number in the format \"+ 12 345 6789\""
}

Here's how to add a number field. In this case it's part of the address and is the house number. This is probably not a good example as there's no real reason the house number needs to be a number or why there'd be a minimum value of 55. Note we've missed out the max paramater and so there is none. Equally we could have a max and no min or no restraints at all. 

{name: "house", type: "number", min: 55}

The field call dob is a date field for the contact's date of birth. Here we pass it both a min and max setting, both of which are JavaScript Date objects. In this case the date of birth must be somewhere between the turn of last century and today. As well as being in a valid date format (dictated by Validator.DateFormat) of course.

{
name
: "dob",
type: "date",
min: new Date(1900, 1, 1),
max: new Date(),
message: "Please enter a valid and realistic date of birth"
}

Here's a conditional field. The Validator is told to only validate the field "kLevel" if the field called "cType" has the third option selected ("Developer").

{
name: "kLevel",
condition: "this.form.cType.selectedIndex==2",
message: "If you\'re a developer, please tell us what knowledge level"
}

Here's a custom validation. The expression value results in a call to a function which we write ourselves. In this case we pass the value of the field being validated to the function. It's then down to that function to return either true or false based on whatever logic is required. 

{
name
: "confirm",
type: "custom",
expression: "myExampleValidationFunction(this.form.confirm.value)",
message: "Please enter the text you see to the right of this field."
}

Note that the field called "confirm" is validated by a custom function completely separate to validation.js and called myExampleValidationFunction(), which we pass the value of the field itself.

We don't have to write a separate function though if we want a custom validation routine. We can pass custom logic straight to the Validator like this:

{
 name: "salary",
 test: function(fld) { return !(fld.value % 2) }, 
 message: "This must be an even number."
}

Don't ask me what salary would need to be an even number. It's just an example. This method is handy if the function is short and sweet. No point storing it elsewhere and cluttering your code up.

Note: We can still add extra fields even after we've created the array! Like this:

Validator.fields.push({name: "WoopsForgotThisOne"})

Other example include: to come.

 

Future enhancements:

Trying to design a validation routine to meet all requirement is not easy. blah.

Form Validator V2 (link) had the option to validate file upload extension types. Worth adding back in?

More to come.... 

validation31.zip

Feedback

  1. Suggested expanded intro

    Current: Forms are as much a part of the web now as are normal text pages, often created by these forms.... expand!

    Proposed: Forms are as much a part of the web now as are normal text pages, making up an ever growing portion of what users interact with. Validating these forms has always been important, but these days it also has to be easy to implement and configure. Writing custom validaitons every time you have a form isn't going to keep pace with the rest of the world - you need to be quick to the task. So, with an eye towards truely reusable and easy to implement client side validation, Codestore proudly presents: Validator 3.0.

      • avatar
      • Jake Howlett
      • Tue 6 Jun 2006

      Re: Suggested expanded intro

      Fancy writing the rest of the article too Jerry? ;o)

      Show the rest of this thread

  2. Suggested future feature

    Hey Jake, good stuff.

    One thing I was thinking on last night was an easy way to tie this to server side validation as we know both client and server side are important. What's needed is a bit of a framework (using available tools) to allow the Javascript client side implementation to be autmatically produced by server side form settings, e.g. a field called Validation_Rules that might invoke a script library which would have a two-fold function: compute the proper JS to call the validator as needed for the form, and to perform WebQuerySave validaiton using the exact same rule set. WQO processes to produce needed runtime JS, WQS processes to server side validate.

    The ruleset might be something as simple as a nested delimited list in a computed text field. field_name:field_label:rule#; field_name:field_label... etc.

    The goal being minimal setup to kill two birds with one stone. Maybe version 4.0, eh?

    • avatar
    • Rob
    • Tue 6 Jun 2006

    Typo + suggestions

    1. In the "condition" part of the table. "The expression should return true of false." should be "The expression should return true or false." 2. "completely separate to validation.js" should be "completely separate from validation.js"

    SUGGESTIONS 1. I think it would be clearer if the properties in the table should have a colon after them. 2. I think "name" should be listed in the table. 3. I'd like to see a bit more explanation of the "condition" parameter. Perhaps something like, "This is particularly useful for a field that isn't required but should be validated if it is non-empty.

      • avatar
      • Jake Howlett
      • Tue 6 Jun 2006

      Re: Typo + suggestions

      Rob. It's called a Rough Cut for a reason ;o) I'll list name parameter in the table and elaborate on conditional fields.

      Show the rest of this thread

    • avatar
    • Rob
    • Tue 6 Jun 2006

    Enhancement suggesion

    You've done so much to add the input validation, have you considered adding input translation as well?

    I realize that input translation is a more general function than validation but, since you have all the infrastructre in place you could add another property to the validation array objects that would be a JavaScript function whos output is used to replace the field value.

    Rob:-]

      • avatar
      • Jake Howlett
      • Tue 6 Jun 2006

      Re: Enhancement suggesion

      Probably not something I'll add but a good idea and is indeed doable. Translation is probably better done server side though.

    • avatar
    • Rob
    • Tue 6 Jun 2006

    prototype.js

    Jake,

    I've been working on a library to accomplish what the "Hide When" formulas do in the Notes client. I've had trouble with prototype.js $F() function with checkboxes and radio buttons. I see in your validation.js you have avoided this feature all together.

    What is your experience with the prototype.js $F() function?

    Thanks,

    Rob:-]

    1. Re: prototype.js

      Rob,

      $F will get the value of the designated container. With radio button and checkboxes, you have an array of elements. Simply using $F won't give you what you want. It requires a more custom approach, such as getting all checkbox inputs and querying their name or custom coding your radio buttons and check boxes instead of letting Domino rendering them.

      In the thread listed below, we covered this over at Datatribe.

      http://datatribesoftwerks.com/members/datatribe/DatatribeBlog.nsf/archive/200510 04-107735

      • avatar
      • Jake Howlett
      • Tue 6 Jun 2006

      Re: prototype.js

      I've never used $F() but I've both read that it doesn't work with radio-type fields and that it does/should. You'll see why it's hard to deal with radios/checks if you look at my code. It's to do with having to deal with the chance there's only one of them. Bit of an annoyance really.

  3. Question

    Hi Jake, thanks for cool validator! I'm having a bit of a problem implementing it though. I have a web form which populates a field (RegExp_id) with a regular expression (/(\D{3}\d{4})$/). I'm attempting to use that regular expression to validate another field (ID) but to no avail. If I do an alert, it's getting the value of the RegExp_id field. I've tried the following:

    var RegEx = new RegExp(document.forms[0].RegExp_id.value,'g'); Validator.fields= [ {name: "ID",type: "regex",pattern: RegEx, message: "Please enter a valid AD ID (abc1234)"} ]

    return Validator.validate();

    Now, if I don't use the variable RegEx and just type in the regular expression everything works as designed. I just can't get past this. Please help.

    Thanks, Keith

      • avatar
      • Jake Howlett
      • Thu 22 Jun 2006

      Re: Question

      Hi Keith. When creating a RegExp from a string you need to "double escape" the \s. So your value passed to the constructor would need to be:

      /(\\D{3}\\d{4})$/

      Hope that helps. Glad you like the code.

      Jake

  4. need help!!!

    Hi everyone! I desperately need help! What i need is a validation based on the existence of a document with the same value in a field. So, for example, if i try to save a doc with the same title field value of another one created before i would get an error message. Any ideas?

    thanks!

      • avatar
      • Jake Howlett
      • Thu 20 Jul 2006

      Re: need help!!!

      Hi,

      You need to use Ajax to send the title field value to the server and get a match back. If it matches validation is failed. You should be able to extropulate the code needed from what's available here.

      Jake

      Hide the rest of this thread

      1. Re: need help!!!

        thank you!! But i have no ajax skill. Can someone give me some other hints? I want to learn but at the moment i need something to start and i have little time to resolve this problem.

    • avatar
    • bas
    • Thu 3 Aug 2006

    onblur

    Very well working way of validation. Thanks. Really great. I would just like to ask one question. I've seen another implementation on the basis of the same javascript library. And there was an extra variable on initialisation, so that field validation would already occur in the onblur event - when a user leaves the field to move on to the next. Would that be easily possible to add? Thanks Bas

      • avatar
      • Jake Howlett
      • Thu 3 Aug 2006

      Re: onblur

      Possible, but not that easy. You would have to change the code's logic so that it could parse fields individually, rather than in blocks, as it does at the moment, which is the way it was intended to work.

      Jake

      Show the rest of this thread

  5. Error: 'Validator.form' message

    I found this code and think is wonderful, just what I needed. I followed the instructions and copied the Save button, but get Error: 'Validator.form' is null or not an object. I'm not sure what I am missing. Any help is appreciated. (Sorry, I posted to the wrong place the first time).

      • avatar
      • Jake Howlett
      • Wed 16 Aug 2006

      Re: Error: 'Validator.form' message

      Sounds like your onload event is missing.

      Jake

      Show the rest of this thread

    • avatar
    • Dawn
    • Tue 15 Aug 2006

    icons used in this demo

    Jake,

    I love this validation, it is really nice. Where did you get the icons that you use for the ! and error message? I would like to use a few other icons, like a "?" for help in my site and would like to fashion it after these.

    Thanks in advance, Dawn

      • avatar
      • Jake Howlett
      • Wed 16 Aug 2006

      Re: icons used in this demo

      Hi Dawn,

      They're by Dan Cederholm http://www.simplebits.com/icons/

      Jake

  6. global.js missing

    I downloaded the attached sample database and do not find global.js under the Files tab. Is there someplace else it should be? Thanks.

      • avatar
      • Jake Howlett
      • Thu 17 Aug 2006

      Re: global.js missing

      In the Javascript libraries in shared code?

      Show the rest of this thread

  7. Javascript

    Jake, do you think you only get domino developer traffic to your site? I think your site's holds its own as a fine example to web development as a whole.

    I strive to maintain/enhance my domino skills at home (v7) despite moving to php in my workplace (we still support some old V5 Domino Apps using v5 clients).

    Enough bush beating: I think if you can publish javascript/DOM/JSON/AJAX articles/downloads for domino, you should think about providing a seperate zipped download of the javascript (not wrapped in the domino template - which amongst other things v5 can't open) and your article could display links to the source libraries you've used.

    I think this would only enhance your web design audience.

    ....and even if it didn't, al least I wouldn't have to wait until I got home to download the template, extract the js to xdrive before working on it the following day ;0)

  8. Found a bug in both this version and v2.0

    This is one of those bugs that only a user could find! It only occurs in August and September!!

    In your v2.0 template (in the validDate function) and perhaps also in this version, you use this kind of thing to create date objects to see if the date entered is within the expected bounds:

    var theDate = new Date(dateBits[2], parseInt(dateBits[1]) - 1, dateBits[0]);

    dateBits contains the day, month and years respectively.

    So when the user is working on a form and today's date is in September (lets say, the 24th) dateBits would contain:

    dateBits[0]="2006" dateBits[1]="09" dateBits[2]="24"

    However, the date object ends up being 24th December 2005!!!!

    Why does this happen? Well there is a 'bug' in parseInt that means that if you use it to convert a string with a leading zero, it assumes it is dealing with OCTAL (base 8) numbers : 08 and 09 are therefore not valid numbers, so parseInt returns zero. Zero is January, so when your code then subtracts -1 it becomes December of the previous year!! I won't go into great detail with regard to the swearing involved in tracking this one down....

    The fix for this is very simple: you simply tell parseInt that you are working in base 10 like this:

    parseInt(dateBits[1], 10)

    Hey presto! parseInt says "oh - you mean NINE!"

      • avatar
      • Jake Howlett
      • Tue 17 Oct 2006

      Re: Found a bug in both this version and v2.0

      Hi Melissa,

      That damned parseInt function! I've been bitten by this one before. I should know by now to always add the extra argument to it. Will add this to my todo list.

      Thanks, Jake

  9. Having problems implementing...

    Jake,

    Nice to see that you have "kept the faith"! I've been very ill for the last 5 years and I'm finally back. Encephalitis. Lost 40% of cognitive and 40% of memory. Yea, it was ugly. I've been doing some major rebuilding of the brain and I'm back! I'm using the Holosync product from www.centerpointe.com. Check it out if you're interested. It's actually a set of serious meditation soundtracks, but I've recovered most of what I lost! Praise God.

    On to other things! I'm currently trying to implement your Validate 3.0b and am getting a couple of errors and some side effects.

    1) On loading, I get an error on Line 33 of Validation.js. Here's the line:

    this.insert_summary_here = $(s);

    The error reads "$ is not defined"

    2) I noticed that the line " Fields marked with a star (*) are mandatory" is always showing.

    I'm not sure that I understand the implications of the tag h3 id="beforeForm". Can you please explain what you're doing?

    From there, things just go down. I'm obviously not able to use validation functionality. Thank God for Firebug, or I'd be dead in the water!

    1. Re: Having problems implementing...

      Oops, I see that : " Fields marked with a star (*) are mandatory" is intentionally there. How do you get your error line to come in under the above line?

    • avatar
    • Val
    • Thu 30 Nov 2006

    Validator validating first time only

    Jake,

    I am having a bit of a weird issue with the form Validator !

    When I click my submit button, the form validator validates the form correctly, then if I chage one of the offending field values to a correct value, the validator does not fire a second time.

    Any ideas why this might happen ?

    I have setup the form in the same fashion as your example.

      • avatar
      • Steve B
      • Tue 26 Jun 2007

      Re: Validator validating first time only

      I am having same issue, i can validate once just fine but after correcting the values it does not run. any suggestions

    • avatar
    • John
    • Fri 12 Jan 2007

    Licensing

    Hey Jake,

    What sort of license are you releasing this under?

    I'd like to use it in an application, but I need to make sure I'll be covered...

      • avatar
      • Jake Howlett
      • Fri 12 Jan 2007

      Re: Licensing

      What kind of application and covered in what way John?

      Jake

      Show the rest of this thread

  10. Can I skip the confirm section

    Congratulations on your first born FELIX!!

    I was not in touch for couple months, I wonder if omit this section will the validation warning message still appears?

    { name: "confirm", type: "custom", expression: "myExampleValidationFunction(this.form.confirm.value)", message: "Please enter the text you see to the right of this field."

    Thanks a lots! Myle

      • avatar
      • Jake Howlett
      • Sat 13 Jan 2007

      Re: Can I skip the confirm section

      Hi Myle,

      If you omit that part of the code the warning message will not appear next to the confirm field.

      Is that what you meant?

      Jake

      Show the rest of this thread

  11. GREAT - but I have one issue

    I have been looking for an easy way to validate Lotus Notes forms for a while now. I have found other solutions, but yours by far is the BEST.

    I have implemented it into my form and it works great if the Anonymous user is set to EDITOR, however, if you set the user to DEPOSITOR it requires that they log-in to the database first.

    The form was working with depositor rights before I added the validation. Do you have any idea what may be requiring the user to login?

      • avatar
      • Jake Howlett
      • Tue 27 Feb 2007

      Re: GREAT - but I have one issue

      Does the depositor user have read public document rights? Make sure all files/resources are available to public access users. Jake

      Show the rest of this thread

  12. Validate File has been attach in FileUpload Contro

    I see in the that you used to have the validation in place for validating that a file was attached using the FileUpload Control. Do you have a time frame on when you may add this in? Or - can you give me some direction on how I can add the code the to Javascript validator?

    Thanks again for SUCH a GREAT tool :o)

      • avatar
      • Jake Howlett
      • Tue 27 Feb 2007

      Re: Validate File has been attach in FileUpload Co

      Easiest way is to copy the code over from the v2 database Jill. Jake

      Show the rest of this thread

  13. validating e-mail addresses

    Great stuff Jake!

    I have some questions however. At the moment it's possible to use spaces in the e-mail field. Is it possible to validate the e-mail field so it doesn't contain spaces?

    Is it also possible to exclude certain domains / strings? Like for instance 'hotmail.com'

    Thanks

    Peter Franken

      • avatar
      • Jake Howlett
      • Tue 27 Feb 2007

      Re: validating e-mail addresses

      Hi Peter.

      The email validation is a regular expression in the code. You can either edit that regexp or create a new one like this:

      {name: "myEmailField", type: "regex", pattern: /hotmail.com/, message: "Hotmail not allowed"},

      For the spaces you'll have to learn a bit more about reg expressions.

      Jake

      Show the rest of this thread

    • avatar
    • Gary Stoker
    • Wed 21 Mar 2007

    getting user logins to work with form validation

    Re: Getting user logins to work with form validati I've finally gotten everything to work for the most part but I have an issue were I need the user to login due to accessing another lotus database which doesnt allow anonymous access, any ideas?

    Thanks

  14. Combining Name Picker and Validator

    I am trying to combine the above functionalities into a single form, but cannot resolve the error messages I'm receiving.

    If I test in IE 6, I receive the error "Object Expected" referring to Element.CSS_PROPERTIES

    If I test in Mozilla Firefox 1.0.7., I receive the error "$w is not defined" in util/effects.js

    In both browsers, after displaying the above errors, I receive "Validator is not defined".

    What I have done is keep both sets of files and code exactly as they are in the databases, and then combine all lines from both $$HTMLHead fields into one.

    Both sample databases work wonderfully separately.

    Thank you in advance for any direction you can provide.

  15. what about after validation

    I like the validation part just fine but after validation has taken place, all the entries have been accepted, then I need to change a couple computed field values, and some hide/when's, etc. Where can you plug in some after validation code?

  16. Radio Button and Check Boxes

    Is there any way to have the message at the bottom of the field instead of at the beginning. It creates crazy wrapping.

  17. getFields

    Hi!

    I plan to use your for validation code with a workflow manager. So I create a form "validation" containing all fields options.

    Now I try to retrieve this and I look deeply into your code.

    What the function getFields is used for ?

    Thanks

  18. Comparing email Addresses

    I need to compare two email address fields to ensure that the user entered the correct email address. I am using the following option:

    {name: "EmailAddress", test: function(fld) { return !(document._Registration.EmailAddress1 == fld.value) }, message: "Email Addresses do NOT match."}

    However, I am receiving JavaScript errors (line 77 in the validation.js and also on the above function, it does not like the fld.value. Do you have any suggestions on how I might be able to compare to field values on the same form? Thank you for any assistance.

    By the way GREAT solution for Notes form validation.

      • avatar
      • Jake Howlett
      • Tue 19 Jun 2007

      Re: Comparing email Addresses

      Hi Jill,

      The problem is more likely in this bit:

      document._Registration.EmailAddress1

      Try this instead:

      document.forms["_Registration"].EmailAddress1.value==fld.value

      Or even:

      fld.form.EmailAddress1.value==fld.value

      Jake

      Show the rest of this thread

  19. Error in call to Validator.init

    I get an error in the init function indicating that '$ is not defined.' I put my call to this function in the form's onLoad event, as so:

    Validator.init( 0, 'beforeForm');

    beforeForm is defined in Pass-Thru HTML. I assume the error message is caused by the last statement in the function.

    init: function(f, s){ this.form=document.forms[f]; this.messages["date"]+=" "+this.DateFormat; this.insert_summary_here = $(s); }

    Any help would be appreciated.

      • avatar
      • Jake Howlett
      • Tue 11 Sep 2007

      Re: Error in call to Validator.init

      Sounds like you're missing the prototype.js file?

      Show the rest of this thread

    • avatar
    • Mark Teichmann
    • Tue 18 Sep 2007

    Problems when submitting a form using AJAX

    I use a Domino form containing my own html form element with ID 'frmNewRequest'. Usually I submit this form using Antrag.submitMe(). This works well and the results are visible in my still open document via ZT.getDetails() call in the code below. Now I'd like to use your validation code. Because I use Ajax instead of form.submit() I tried to check if Validator.validate() is true before creating my document via Ajax. But unfortunately I get an endless loop in Prototype.js line 1323 (too much recursion). Do you have any hint where to search? The problem arises after Validator.validate() returns true. Can there be a problem that both our functions use prototype? I tried debugging with FireBug but it does not work. Before starting the loop the debugger ends debugging!? I also tried to replace the $F statements below with constant strings but this does not change anything.

    var Antrag = { submitMe:function() { if ( Validator.validate()) { $('frmNewRequest').request( { method: 'get', parameters: 'Action=Create&AWNR='+$F('AWNR')+'&Personalnr='+$F('Personalnr'), onSuccess: ZT.getDetails }); }} }

      • avatar
      • Mark Teichmann
      • Tue 18 Sep 2007

      Re: Problems when submitting a form using AJAX

      the problem appears when 'this' = span#advice-myfield.validation-advice

      in this prototype function, which is called in an endless loop somehow:

      Element.extend.cache = { findOrStore: function(value) { return this[value] = this[value] || function() { return value.apply(null, [this].concat($A(arguments))); } };

      Show the rest of this thread

  20. Validator Undefined

    The validator works great when a doc is created. We allow anonymous users to author documents and the validation works. Document saves fine. I go back and EDIT a document and log on to do so (access control for edits). Whether I change anything or not, the document will not save and produces a js error "validator undefined'. HELP!

      • avatar
      • Jake Howlett
      • Fri 12 Oct 2007

      Re: Validator Undefined

      Sounds like a relative URL thing to me Dan.

      Make sure the validator.js file is loading. It might open in create mode as the script file's URL is relative to /db.nsf/Form?Open whereas in edit mode it is relative to /db.nsf/view/doc?open which a "directory" deeper.

      If you're playing with stuff like this you really need to be using some kind of sniffer or ideally you should develop with Firefox and Firebug!

      Jake PS: Say hello to Dawn.

      Show the rest of this thread

    • avatar
    • R
    • Sat 16 Feb 2008

    Share a simple improvement

    Add the below to the test procedure in order to validate basic email format multi-value separated by comma. Does not handle phrases RFC-822 :)~ Enjoy

    case "multiemail": var emailStr = f.value.trim(); if(emailStr == ''){return true}; //the field is allowed to be empty

    var mySplitResult = emailStr.split(","); var reg1 = /(@.*@)|(\.\.)|(@\.)|(\.@)|(^\.)/; // not valid var reg2 = /^.+\@(\[?)[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,3}|[0-9]{1,3})(\]?)$/; // valid for(i = 0; i < mySplitResult.length; i++){ var testVal = mySplitResult[i].trim() +'';if ( !reg1.test( testVal ) && reg2.test( testVal ) ) { // this address passes } else {return false;} } return true; break;

  21. Error in IE

    I get an error in IE7... 'name' is null or not an object. I think it is at this point in the validation.js. => var obj = Validator.form[fld.name];

    However if i do an alert(fld.name) right before this it shows the correct field name.??#$?#%

    I have tested this with your bone stock download and get the same error. Any ideas?

    P.S. Of course it works in Firefox and Safari without any problems.

      • avatar
      • Jake Howlett
      • Tue 18 Mar 2008

      Re: Error in IE

      Are you saying that the online demo linked to from the main article doesn't work in IE7? It works fine for me.

    1. Re: Error in IE

      Actually the version hosted on your site works, but when I use your download on one of our servers it does not work.

      Which is actually good, because I found one discussion on the web that said someone had this problem with a incomplete install of ms.net on their pc. I was beginning to think all of our pc's had misinstalled ms.net frameworks.

      I will try and see whats different between the versions and post back if I can determine it. Thanks again for the great resources you provide...

      Show the rest of this thread

      • avatar
      • okan
      • Fri 25 Sep 2009

      Re: Error in IE

      I had the same problem but it was because I forgot to remove the last comma from the list of to-be validated fields list in the "JS Header" of the form. It didn't cause a problem in Firefox but IE kept complaining.

  22. Second form

    Jake, have you done this validation since you wrote this rough-cut? I am trying to implement on a form where I have closed the standard domino form with a </form> and created my own. The other caveat is that I am submitting to a third party (shopping cart). Something just isn't lining up.

    I have used rich waters version of this, which is a bit simpler, but I like the page message and the way you are inserting the messages in the forms a bit better.

    • avatar
    • Gary Stoker
    • Mon 9 Jun 2008

    field value not required but value format checked

    I don't see one but how would I go about having the option to make a field not required to have something in it. I still would want the fields value checked to be in the correct format.

    • avatar
    • Heba
    • Tue 7 Jul 2009

    text/html

    Hi Jake,

    This is a great tool. I was wondering if you could tell me how to make it work with content type text/html. I get an error "validator.form is null or not an object".

    I did put the onload in the body tag, the onsubmit in the form tag and js directly on the form. Any suggestions?

    Appreciate your time.

    Thanks,

    Heba

      • avatar
      • Heba
      • Thu 9 Jul 2009

      Re: text/html

      In the body tag onload event, I removed the "_" from the form name and that worked. Thanks for the great code!

  23. Stop Validation on Refresh

    I was wondering if there is a way to limit the validation to only a submit button. Specifically when Domino refreshes the page for field refreshes for example. I would like the fields to refresh for lookups, etc. but not actully fire the validator until the form is officially submitted by the user.

    • avatar
    • Rob
    • Wed 10 Mar 2010

    Hi Jake,

    Fabulous tool, but having a weird behavior. I am calling this from a button instead, because the form is very long and complex and I want people to be able to save draft versions and come back before validating. After validating, they can perform the next steps in the workflow.

    So, when the validation is called from a "Save Final" button, I see a flash of the validation fail divs next to each field, but then the screen refreshes and they disappear.

    Any thoughts on what that might be?

    Thanks,

    Rob

      • avatar
      • Jake Howlett
      • Thu 11 Mar 2010

      Hi Rob,

      No idea what's going on there. Have you got an online version I can look at?

      Show the rest of this thread

    • avatar
    • Rob
    • Sat 27 Mar 2010

    Hi, having a new issue with this, wondering if you can help. I use hidden fields (span with display:none around them) to validate the file uploads on my form (so, on change of the file upload, it writes the value of the file to a separate field so I can (a) validate it is there and (b) get it later for links and so on. So, the field is being validated properly, but the error message doesn't display, I assume because it is being included in an undisplayed span. Any thoughts on how to get the error message to display? I could have sworn it was working a little while ago, but haven' really changed the validator or the way those fields work.

      • avatar
      • Rob
      • Sat 27 Mar 2010

      I should really just work a bit harder at these things before posting, I suppose... Instead of using a <span> around the field, I just put "display:none" in the HTML style attribute for the field, and now the form is validating properly. Anyway, a learning experience if someone else is doing similar.

  24. Hi Jake!

    I have been using your validator 3.0 for a few years now, and it's wonderful! I have come across something that I don't know how to deal with and am hoping that you can point me in the right direction.

    I have a field called End Date, which I need to validate in 2 ways:

    1. If a specific radio button selection has been made in another field, the End Date field needs to contain an entry.

    2. Regardless of anything else on the form, if an End Date is entered, it needs to be greater than the Start Date entry.

    As you can see, there would be separate messages for each of these, however they would both be generated from the End Date field, which is the problem I'm facing.

    I've tried to use {name: "endDate".....} twice in the list of validator fields, but that doesn't work as only one is actually used.

    I've tried to use Andrew Tetlaw's add.AllThese, in the validation.js file inside the "var Validator = ...." area, right below "has Selection", but I receive "Missing } after property list". I had thought I would then put Validator.addAllThese([ ..... directly below the } for the end of the validator, and then call it from inside "Validator.fields=..." in the JS Header area of the form.

    Am I on the right path, or totally off base?

      • avatar
      • Jake Howlett
      • Tue 16 Aug 2011

      Hi Lenni,

      Sound like you should be able to do that using a custom validation function. In my code that means you have to pass in a parameter called "test" which points to your own function that returns true or false.

      I'm not that familiar with Andrew's code, so I can't comment on the path you're taking at the moment.

      Jake

      Show the rest of this thread

  25. I figured it out!

    Ok, there may be another way, but here's the way I did it.

    * I actually used condition because I needed to pass in 3 fields. * Then for message: I just put "". This resets the message, otherwise, it stays on the last one displayed.

    * Then, in my function, I set the Validator fields using the location of the validator for the function I'm using. Here's an example:

    // The End Date cannot be before the Start Date and, if the employeeType selection is Researcher, there must be a date entered in the End Date field

    function researcherFunction(radioObj, end, start){

    if (end != "") {

    if(new Date(end) < new Date(start)){

    Validator.fields[15].message = "The End Date must be greater than the Start Date";

    }

    }

    else if(radioObj){

    var radioLength = radioObj.length;

    for(var i = 0; i < radioLength; i++) {

    if(radioObj[i].checked) {

    var selected = radioObj[i].value;

    if((selected == "Researcher") && (end == "")){

    Validator.fields[15].message = "You must select an End Date for a 'Researcher' Employee Type";

    }

    else{

    return true;

    }

    }

    }

    }

    else {

    return true;

    }

    }

    • avatar
    • Lenni Sauve
    • Tue 19 Jun 2012

    Hi Jake!

    I'm still using your validator, and finding it very effective.

    I am finding that if I have a function for a field, which contains different error messages, sometimes the same error message is retained, when it should change to another. So I need to find a way to clear the existing message and present the new one. Seems so simple, but I can't get this to happen. I've tried setting the message to nothing or calling a reload, but nothing seems to work properly. Do you have any suggestions?

    Another thing that has just started happening within the validation.js file is, when it is opened, I receive 10 errors. The first 2 are "Synax error on token ",", LiteralField expected after this token" and the last 8 are "Syntax error on token "break",; expected after this token". How can I fix these?

    Thanks!

    • avatar
    • Lenni Sauve
    • Tue 19 Jun 2012

    I'm wondering if I have the most recent version. I've just downloaded 3.1, but inside the validation.js, they both say v3.0 at the top and Version: 1.0.0 inside var Validator. However the one I have has many variants in the Outline area, compared to both of the above. And I know that you had helped me with mine.

    Any ideas?

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


Navigate other articles in the category "Forms"

« Previous Article Next Article »
Simple multi-lingual forms using Domino   Accessible Ajax With Domino Forms

About This Article

Author: Jake Howlett
Category: Forms
Keywords: validation; prototype; fields;

Attachments

validation30.zip (89 Kbytes)
validation31.zip (92 Kbytes)

Options

View Online Demo
Feedback
Print Friendly

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »