• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Alfresco Forms Service Deep Dive
 

Alfresco Forms Service Deep Dive

on

  • 3,967 views

This session will examine each element of the Forms Service Architecture in detail, from the server-side FormProcessor & Form Filters to the client-side Form UI component and Forms Runtime JavaScript ...

This session will examine each element of the Forms Service Architecture in detail, from the server-side FormProcessor & Form Filters to the client-side Form UI component and Forms Runtime JavaScript library. You will learn how to use the form services in your own applications, discuss configuration options and work through several customization examples demonstrating how to implement custom controls, form templates and form filters.

Statistics

Views

Total Views
3,967
Views on SlideShare
3,967
Embed Views
0

Actions

Likes
3
Downloads
91
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • There are a few more methods with a Map parameter representing a context, not shown for brevity and not used yet.
  • There is also a Map parameter representing a context, not shown for brevity and not used yet

Alfresco Forms Service Deep Dive Alfresco Forms Service Deep Dive Presentation Transcript

  • Alfresco Forms Part 2: Deep Dive
    1
    Gavin Cornwell
    Services Team Lead, Alfresco
    twitter: @gcornwell
  • Agenda
    2
    • Architecture
    Form Service
    Form UI Component
    Forms Runtime
    • Demo (Customization)
    • Debugging
    • Q & A
  • Architecture
    3
  • Form Service Overview
    4
  • Form Service – Java API
    5
    • Item
    Kind
    Id
    • Form object returned
    public Form getForm(Item item);
    public Form getForm(Item item, List<String> fields);
    public Form getForm(Item item, List<String> fields, List<String> forcedFields);
    public Object saveForm(Item item, FormData data);
  • Form Service – FormProcessor
    6
    • Matched by Item Kind
    • FilteredFormProcessor
    • Node, Type, Workflow & Task implementations
    public Form generate(Item item, List<String> fields, List<String> forcedFields);
    public Object persist(Item item, FormData data);
    public booleanisApplicable(Item item);
    public booleanisActive();
  • Form Service – Form Filter
    7
    Similar to Servlet Filters
    Recommended way to customise
    Each FormProcessor has a FilterRegistry
    Filter is called for every item
    Do conditional checks in your filter
    Examples in RM
  • Form Service – Form Filter
    8
    public void beforeGenerate(ItemType item, List<String> fields, List<String> forcedFields, Form form);
    public void afterGenerate(ItemType item, List<String> fields, List<String> forcedFields, Form form);
    public void beforePersist(ItemType item, FormData data);
    public void afterPersist(ItemType item, FormData data, PersistTypepersistedObject);
    public booleanisActive();
  • REST API /api/formdefinitions Request
    9
    POST /api/formdefinitions
    Returns form definition
    JSON passed in
    JSON response
    POST /api/formprocessor
    Persists form data
    JSON or multipart/form-data passed in
    Response matches request type
    Examples of JSON will be seen in the demo
  • Form UI Component Overview
    10
  • Form UI Component – Web Script
    11
    Java backed UI Web Script as of 3.4
    <@region id=“metadata" scope="template” protected=true />
    <component>
    <region-id>metadata</region-id>
    <url>/components/form</url>
    <properties>
    <itemKind>node</itemKind>
    <itemId>{nodeRef}</itemId>
    <mode>edit</mode>
    <submitType>json</submitType>
    </properties>
    </component>
  • Form UI Component Options
    12
    • itemKind
    • itemId
    • formId
    • mode
    • destination
    • redirect
    • submitType
    json
    multipart (default)
    urlencoded
    method
    submissionUrl
    showSubmitButton
    showCancelButton
    showResetButton
    showCaption
  • Form UI Component Event Sequence
    13
    Asks ConfigService for list of fields for item
    Sends list of fields (if any) to FormService
    FormService response “combined” with configuration for item
    “form” model is set (demo will show example)
    FreeMarker template is rendered
    Custom template used if configured
    FTL for each control is #included
    Forms Runtime initialisation code generated
  • Form UI Component FreeMarker
    14
    <#if form.xxxTemplate?? && form.mode == ”xxx">
    <#include "${form.xxxTemplate}" />
    <#else>
    <#if formUI == "true">
    <@formLib.renderFormsRuntimeformId=formId />
    </#if>
    <@formLib.renderFormContainerformId=formId>
    <#list form.structure as item>
    <#if item.kind == "set">
    <@formLib.renderSet set=item />
    <#else>
    <@formLib.renderField field=form.fields[item.id] />
    </#if>
    </#list>
    </@>
    </#if>
  • Forms Runtime JavaScript Library
    15
    • YUI Based
    • Manages form validation
    Register validation handlers
    Dynamically adjusts the submit button state
    • Handles form submission
    POSTing data as JSON
    AJAX submission
    Callbacks for custom processing before & after submission
    • Can be used standalone
  • Form Generation
    16
  • Form Persistence
    17
  • Customisation (Demo)
    18
    • Configure custom type
    • Create a custom form control (YUI Slider)
    • Create a custom form template (tabbed form)
    • Implement a Form Filter
    afterGenerate
    beforePersist
    • Debugging Tips
    Forms Development Kit (FDK)
  • Debugging
    19
    • Log4J settings
    org.alfresco.repo.forms=debug
    org.alfresco.web.config.forms=debug
    org.alfresco.web.scripts.forms=debug
    • Forms Development Kit (FDK)
    Form Console (/<app>/fdk/form-console)
    Debug control & template (dumps model)
    • Cntrl, Cntrl, Shift, Shift
    • Eclipse
    FormUIGet for UI
    FilteredFormProcessor for server
    • Spring Surf Developer Tools
  • Roadmap
    20
    • Reduce the volume of configuration required
    • Repeating field and group support
    • Upload support
    • Improve association support
    • Improve error handling (validation feedback)
    • Dependent field support
    • Form level validation
    • More controls
  • Q & A
    21
  • Learn More
    22
    wiki.alfresco.com/wiki/Forms
    blogs.alfresco.com/wp/gavinc/
  • Appendix – Demo Config
    23
    <config evaluator="node-type" condition="devcon:session">
    <forms>
    <form>
    <field-visibility>
    <show id="devcon:code" />
    <show id="cm:name" />
    <show id="devcon:abstract" />
    <show id="devcon:presenter" />
    <show id="devcon:duration” />
    <show id="daysAway" />
    <show id="devcon:when" />
    <show id="devcon:level" />
    <show id="devcon:prerequisites" />
    <show id="devcon:approved" />
    <show id="devcon:rating" />
    </field-visibility>
    <edit-form template="/devcon/tab-edit-form.ftl" />
    <appearance>
    <set id="" label="Details" />
    <set id="time" label="Time" />
    <set id="feedback" label-id="set.label.feedback" />
    <field id="devcon:approved" set="feedback" />
    <field id="devcon:rating" set="feedback">
    <control template="/devcon/progress.ftl" />
    </field>
    <field id="devcon:when" set="time" />
    <field id="devcon:duration" set="time" />
    <field id="daysAway" set="time" />
    </appearance>
    </form>
    </forms>
    </config>
  • Working Example
    24
    • The working example will be made available in the next few weeks on my blog at http://blogs.alfresco.com/wp/gavinc
    • In the meantime have a look at the FDK for more examples