CGI-Ex
    
    
  
  
  
view release on metacpan or search on metacpan
lib/CGI/Ex/Validate.pod view on Meta::CPAN
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.
samples/app/cgi_ex_1.cgi view on Meta::CPAN
sub get_content_form {
  return qq{
    <html>
    <head>
      <title>[% title %]</title>
      <style>
      .error {
        display: block;
        color: red;
        font-weight: bold;
      }
      </style>
    </head>
    <body>
    <h1 style='color:blue'>Please Enter information</h1>
    <span style='color:red'>[% error_header %]</span>
    <br>
    <form name="[% form_name %]" action="[% script_name %]" method="POST">
    <input type=hidden name=processing value=1>
samples/app/cgi_ex_2.cgi view on Meta::CPAN
sub main_file_print {
    return \ qq {
    <html>
    <head>
      <title>[% title %]</title>
      <style>
      .error {
        display: block;
        color: red;
        font-weight: bold;
      }
      </style>
    </head>
    <body>
    <h1 style='color:blue'>Please Enter information</h1>
    <span style='color:red'>[% error_header %]</span>
    <br>
    <form name="[% form_name %]" action="[% script_name %]" method="POST">
    <input type=hidden name=processing value=1>
samples/validate_js_2_onchange.html view on Meta::CPAN
    <input type=submit value=Submit>
  </td>
</tr>
</table>
</form>
<script src="../lib/CGI/Ex/validate.js"></script>
<script>
document.validate_set_hook = function (args) {
  if (!document.getElementById(args.key+'_img')) alert('cannot set '+args.key);
  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 (!document.getElementById(args.key+'_img')) alert('cannot clear '+args.key);
  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';
  }
};
document.validation = {
  "group onevent": 'change,blur,submit',
  "group no_confirm": 1,
  "group no_alert": 1,
( run in 3.208 seconds using v1.01-cache-2.11-cpan-5dc5da66d9d )