Page 1 of 1

Client-Side Validation

PostPosted: Sat Oct 23, 2010 3:13 pm
by ADobkin
Re: Form Validation:

http://xataface.com/documentation/tutor ... validation

This document indicates both client-side (javascript) and server-side validation are available. However, I can't seem to figure out how to initiate client-side. For example, how would I enforce a maxlength on a field at the time of entry rather than waiting until the form is submitted?

Here is how it would be done according to the QuickForm docs:

By default, the validation rules check submitted data once it has been sent to the server. You can also enable client-side validation for some rules. To have a rule checked by the browser, before the data is submitted, add client as a fifth argument to addRule(). For example, to make sure a value is entered in the subject field that is at least five characters long, you’d use this:

// subject is required and must be at least 5 characters
$form->addRule('subject','Enter a valid subject','required',null,'client'); $form->addRule('subject','Enter a valid subject','minlength',5,'client');

The client-side validation is accomplished by JavaScript functions added to the form by HTML_QuickForm. When a user clicks the form’s submit button, the JavaScript functions run the client-side validation rules and pop up an alert box if any of the rules are not satisfied. Client-side validation is available for all of the built-in rules except for uploadedfile, maxfilesize, mimetype, and filename. It is also available for any custom regex rules. You can enable client-side validation on custom function rules if you also define a JavaScript function in the page with the same name as the custom function. That JavaScript function must duplicate the checks that the server-side PHP validation function does.

Re: Client-Side Validation

PostPosted: Sat Oct 23, 2010 3:44 pm
by shannah
Xataface uses client side validation as a default (in addition to server side). i.e. the 'client' option is set for all rules. If it is failing, you should check your browser for javascript errors to see why the code isn't running.

Live/Realtime Form Validation

PostPosted: Sun Oct 24, 2010 9:42 pm
by ADobkin
Thanks for the clarification. It turns out that it is working as documented.

What I meant to ask: Does Xataface offer support for live/realtime form entry validation, so that users are given immediate feedback rather than waiting until the form is submitted? My understanding is this requires the use of onBlur and/or onChange events. It appears the easiest way to do this is to extend HTML_QuickForm with the DHTMLRulesTableless package:

http://pear.php.net/package/HTML_QuickF ... Tableless/

Alternatively, there are some very interesting open-source libraries for more advanced form validation options, such as LiveValidation:
http://livevalidation.com/

Interesting html FORM Validators for web developers
http://woork.blogspot.com/2009/02/inter ... s-for.html

Impress your Web Visitors with real-time Form Validation
http://www.marketingtechblog.com/progra ... avascript/

Degradable Ajax Form Validation
http://particletree.com/features/degrad ... alidation/

Could something like this be added to Xataface?

Thanks,
Alan

Re: Client-Side Validation

PostPosted: Thu Oct 28, 2010 6:26 am
by ADobkin
Ironically, my main purpose for posting this topic turned out to be an incredibly simple solution. I wanted to limit the number of characters typed into a text field. Initially, I was using the widget:atts:size parameter, which only limits the size of the entry box but not the number of characters (i.e. it can scroll past the end of the box). Then I used the validators:maxlength form validation option, but that doesn't take effect until the user reaches the end of the form and clicks submit.

The simplest solution to limit the number of characters entered into a text box is:

widget:atts:maxlength = #

I did not see this mentioned on the "Getting Started" page about widgets, so I added a comment at the bottom.

It would still be nice to consider some of these fancy new validation scripts, but my problem is resolved now.

Thanks!
Alan