NAME

HTML::FormHandler::Render::RepeatableJs

VERSION

version 0.40019

SYNOPSIS

Creates jQuery javascript to add and delete repeatable elements.

Note: This is still EXPERIMENTAL. This is an EXAMPLE. Changes are very likely to occur. Javascript is not guaranteed to be best practice. It will not work on all rendered repeatables (requires wrapper with id). It is strongly suggested that you make your own role if you use it. Then you can modify it as needed. Or just write out the rep_ data to javascript variables, and write the function in javascript. This function uses a plain javascript confirmation dialog. You almost certainly want to do something else. This javascript depends on the Bootstrap 'controls' div class in order to position the new elements. You will have to modify it to work if you don't use Bootstrap rendering.

A role to be used in a Form Class:

    package MyApp::Form::Test;
    use HTML::FormHandler::Moose;
    extends 'HTML::FormHandler';
    with 'HTML::FormHandler::Render::RepeatableJs';
    ...

DESCRIPTION

This contains one method, 'render_repeatable_js'. It's designed to be used in a template, something like:

    [% WRAPPER "wrapper.tt" %]
    [% form.render_repeatable_js %]
    <h1>Editing Object .... </h1>
    [% form.render %]
    [% END -%]

It will render javascript which can be used with the AddElement field, and setting the 'setup_for_js' flag in the Repeatable field to add the ability to dynamically add a new repeatable element in a form.

Note: this code is provided as an example. You may need to write your own javascript function if your situation is different.

Some of the extra information (level) in this function is in preparation for handling nested repeatables, but it's not supported yet.

This function operates on HTML elements that have the id of the repeatable element. That requires that the wrapper have the repeatable instance ID (now rendered by default). If you don't have wrappers around your repeatable elements, this won't work.

See HTML::FormHandler::Field::AddElement for an example of rendering an HTML element that can be used to provide the AddElement button. See that field for the requirements for the add HTML.

There is no example of a remove button because it's very basic and there are too many different places to put it and ways to do it. The main requirements are that the button have a 'data-rep-elem-id' attribute that contains the id of the repeatable element to remove, and a class of 'rm_element'. It should be a child field of the repeatable.

This one works:

    has_field 'elements.rm_element' => (
        type => 'Display', render_method => \&render_rm_element );
    sub render_rm_element {
        my $self = shift;
        my $id = $self->parent->id;
        return qq{<span class="btn rm_element" data-rep-elem-id="$id">Remove</span>};
    }

NAME

HTML::FormHandler::Render::RepeatableJs

AUTHOR

FormHandler Contributors - see HTML::FormHandler

COPYRIGHT AND LICENSE

This software is copyright (c) 2013 by Gerda Shank.

This is free software; you can redistribute it and/or modify it under the same terms as the Perl 5 programming language system itself.