view release on metacpan or  search on metacpan

lib/CGI/Ex/Validate.pod  view on Meta::CPAN

=back

=head1 JAVASCRIPT

CGI::Ex::Validate provides for having duplicate validation on the
client side as on the server side.  Errors can be shown in any
combination of inline and confirm, inline and alert, inline only,
confirm only, alert only, and none.  These combinations are controlled
by the group options no_inline, no_confirm, and no_alert.
Javascript validation can be generated for a page using the
C<-E<gt>generate_js> method of CGI::Ex::Validate.

(Note: It is also possible to store the validation inline with the
html as YAML and have it read in using the HTML conf handler - but
this feature has been deprecated - see the included html samples for
how to do this).

Generate JS will create something similar to the following (based on your validation):

    <script src="/cgi-bin/js/CGI/Ex/validate.js"></script>
    <script>
    document.validation = {
      'group no_confirm': 1,
      'group no_alert':   1,
      'group onevent':    'change,blur,submit',
      'group order': ['username', 'password'],
      username: {
        required: 1,
        max_len: 20
      },
      password: {
        required: 1,
        max_len: 30
      }
    };
    if (document.check_form) document.check_form('my_form_name');
    </script>

If inline errors are enabled (default), each error that occurs will attempt
to find an html element with its name as the id.  For example, if
the field "username" failed validation and created a "username_error",
the javascript would set the html of <span id="username_error"></span>
to the error message.

It is suggested to use something like the following so that you can
have inline javascript validation as well as report validation errors
from the server side as well.

   <span class=error id=password_error>[% password_error %]</span><br>

If the javascript fails for some reason, the form should still be able
to submit as normal (fail gracefully).

Additionally, there are two hooks that are called when ever an inline
error is set or cleared.  The following hooks are used in
samples/validate_js_2_onchange.html to highlight the row and set an icon.

    document.validate_set_hook = function (args) {
      document.getElementById(args.key+'_img').innerHTML
        = '<span style="font-weight:bold;color:red">!</span>';
      document.getElementById(args.key+'_row').style.background
        = '#ffdddd';
    };

    document.validate_clear_hook = function (args) {
      if (args.was_valid) {
        document.getElementById(args.key+'_img').innerHTML
            = '<span style="font-weight:bold;color:green">+</span>';
        document.getElementById(args.key+'_row').style.background
            = '#ddffdd';
      } else {
        document.getElementById(args.key+'_img').innerHTML = '';
        document.getElementById(args.key+'_row').style.background = '#fff';
      }
    };

If you have jquery that looks like:

    document.validate_set_hook = function (args) {
      $('#'+args.key+'_img').html('<span style="font-weight:bold;color:red">!</span>');
      $('#'+args.key+'_row').css('backgroundColor', '#ffdddd');
    };

    document.validate_clear_hook = function (args) {
      if (args.was_valid) {
        $('#'+args.key+'_img').html('<span style="font-weight:bold;color:green">+</span>');
        $('#'+args.key+'_row').css('backgroundColor', '#ddffdd');
      } else {
        $('#'+args.key+'_img').html('');
        $('#'+args.key+'_row').css('backgroundColor', '#fff');
      }
    };

These hooks can also be set as "group clear_hook" and "group set_hook"
    which are defined further above.

    If the confirm option is used ("group onevent" includes submit and
    "group no_confirm" is false), the errors will be displayed to the
    user.  If they choose OK they will be able to try and fix the errors.
    If they choose cancel, the form will submit anyway and will rely on
    the server to do the validation.  This is for fail safety to make sure
    that if the javascript didn't validate correctly, the user can still
submit the data.

=head1 LICENSE

This module may be distributed under the same terms as Perl itself.

=head1 AUTHOR

Paul Seamons <perl at seamons dot com>

=cut