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 )