HTML-FormHandlerX-JQueryRemoteValidator

 view release on metacpan or  search on metacpan

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm  view on Meta::CPAN

package HTML::FormHandlerX::JQueryRemoteValidator;
$HTML::FormHandlerX::JQueryRemoteValidator::VERSION = '0.24';
use HTML::FormHandler::Moose::Role;
use Method::Signatures::Simple;
use JSON ();


has_field _validation_scripts => (type => 'JavaScript', set_js_code => '_js_code_for_validation_scripts');

has validation_endpoint => (is => 'rw', isa => 'Str', default => '/ajax/formvalidator');

has jquery_validator_link => (is => 'rw', isa => 'Str', default => 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js');

has skip_remote_validation_types  => (is => 'rw', isa => 'ArrayRef', default => sub { [ qw(Submit Hidden noCAPTCHA Display JSON JavaScript) ] });

has skip_all_remote_validation => (is => 'rw', isa => 'Bool', default => 0);

method _js_code_for_validation_scripts () {
    return '' if $self->skip_all_remote_validation;
    my $spec_data = $self->_data_for_validation_spec;

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm  view on Meta::CPAN

        else {
            $js_profile->{rules}->{$f->id}->{remote} = $self->_build_remote_rule($f);
        }
    }

    return $js_profile;
}

method _build_remote_rule ($field) {
    my $remote_rule = {
        url => sprintf("%s/%s/%s", $self->validation_endpoint, $self->name, $field->id),
        type => 'POST',
        data => $self->name . "_data_collector",
        };

    return $remote_rule;
}

method _data_collector_script () {
    my @func;
    foreach my $f (sort {$a->name cmp $b->name} $self->fields) { # the sort is for consistent output in tests

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm  view on Meta::CPAN

        my $err = join ' ', @{$form->field($.field_name)->errors};
        my $result = $err || 'true';

        $m->print(JSON->new->allow_nonref->encode($result));
    }

=head1 CONFIGURATION AND SETUP

The purpose of this package is to build a set of JQuery scripts and inject them
into your forms. The scripts send user input to your server where you must
provide an endpoint that can validate the fields. Since you already have an
HTML::FormHandler form, you can use that.

The package uses the remote validation feature of the JQuery Validator
framework. This also takes care of updating your form to notify the user of
errors and successes while they fill in the form. You will most likely want
to customise that behaviour for your own situation. An example is given below.

=head2 What you will need

=over 4

=item JQuery

Load the JQuery library somewhere on your page.

=item JQuery validator

See the C<jquery_validator_link> attribute.

=item Server-side validation endpoint

See the C<validation_endpoint> attribute.

=item Some JS fragments to update the form

=item CSS to prettify it all

=back

=head2 An example using the Bootstrap 3 framework

=head3 Markup

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm  view on Meta::CPAN

        validClass => '"has-success"',
        errorPlacement => q/function(errorLabel, element) {
                errorLabel.appendTo( element.parent("div").parent("div") );
            }/,
    };

    has '+jqr_validate_options' => (default => sub {$jqr_validate_options});

=head2 Class (form) attributes

=head3 C<validation_endpoint>

Default: /ajax/formvalidator

The form data will be POSTed to C<[validation_endpoint]/[form_name]/[field_name]>.

Note that *all* fields are submitted, not just the field being validated.

You must write the code to handle this submission. The response should be a JSON
string, either C<true> if the field passed its tests, or a message describing
the error. The message will be displayed on the form.

The synopsis has an example for Poet/Mason.

=head3 C<jquery_validator_link>

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm~  view on Meta::CPAN

package HTML::FormHandlerX::JQueryRemoteValidator;

use HTML::FormHandler::Moose::Role;
use Method::Signatures::Simple;
use JSON ();


has_field _validation_scripts => (type => 'JavaScript', set_js_code => '_js_code_for_validation_scripts');

has validation_endpoint => (is => 'rw', isa => 'Str', default => '/ajax/formvalidator');

has jquery_validator_link => (is => 'rw', isa => 'Str', default => 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js');

has skip_remote_validation_types  => (is => 'rw', isa => 'ArrayRef', default => sub { [ qw(Submit Hidden noCAPTCHA Display JSON JavaScript) ] });

has skip_all_remote_validation => (is => 'rw', isa => 'Bool', default => 0);

method _js_code_for_validation_scripts () {
    my $spec_data = $self->_data_for_validation_spec;
    my $spec = JSON->new->utf8

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm~  view on Meta::CPAN

        else {
            $js_profile->{rules}->{$f->id}->{remote} = $self->_build_remote_rule($f);
        }
    }

    return $js_profile;
}

method _build_remote_rule ($field) {
    my $remote_rule = {
        url => sprintf("%s/%s/%s", $self->validation_endpoint, $self->name, $field->id),
        type => 'POST',
        data => $self->name . "_data_collector",
        };

    return $remote_rule;
}

method _data_collector_script () {
    my @func;
    foreach my $f (sort {$a->name cmp $b->name} $self->fields) { # the sort is for consistent output in tests

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm~  view on Meta::CPAN

    }


=cut


=head1 CONFIGURATION AND SETUP

The purpose of this package is to build a set of JQuery scripts and inject them
into your forms. The scripts send user input to your server where you must
provide an endpoint that can validate the fields. Since you already have an
HTML::FormHandler form, you can use that.

The package uses the remote validation feature of the JQuery Validator
framework. This also takes care of updating your form to notify the user of
errors and successes while they fill in the form. You will most likely want
to customise that behaviour for your own situation. An example is given below.

=head2 What you will need

=over 4

=item JQuery

Load the JQuery library somewhere on your page.

=item JQuery validator

See the C<jquery_validator_link> attribute.

=item Server-side validation endpoint

See the C<validation_endpoint> attribute.

=item Some JS fragments to update the form



=item CSS to prettify it all

=back

=head2 An example using the Bootstrap 3 framework

lib/HTML/FormHandlerX/JQueryRemoteValidator.pm~  view on Meta::CPAN

        validClass => '"has-success"',
        errorPlacement => q/function(errorLabel, element) {
                errorLabel.appendTo( element.parent("div").parent("div") );
            }/,
    };

    has '+jqr_validate_options' => (default => sub {$jqr_validate_options});

=head2 Class (form) attributes

=head3 C<validation_endpoint>

Default: /ajax/formvalidator

The form data will be POSTed to C<[validation_endpoint]/[form_name]/[field_name]>.

Note that *all* fields are submitted, not just the field being validated.

You must write the code to handle this submission. The response should be a JSON
string, either C<true> if the field passed its tests, or a message describing
the error. The message will be displayed on the form.

The synopsis has an example for Poet/Mason.

=head3 C<jquery_validator_link>