AJAX Forms Application

http://incubator.myxwiki.org/xwiki/bin/view/Improvements/ApplicationWithinMinutesProposalI2

• AJAX Forms Application
  • Main Objective
  • Description
  • Functionality
  • Detailed Functionality
  • Suggestions
  • Further Work
  • Technicalities

Main Objective

This application aims to allow end users to create custom forms via an easy-to-use drag-and-drop interface and manage/export the submitted data 

Description

The application will allow users to create custom forms via a 3 step wizard. Users will be able to drag-and-drop form elements into place and edit them, the resulted form being generated live.
When a form is filled in, a user will have the option to hide his submission to others/track it/ watch it/ etc

Functionality

• Step 1 - Describe your application
  • Application Name - the desired title for the form visible to the users
  • Application Icon - allow users to upload an icon for their forms
  • Application Description
• Step 2 - Define the structure of your application
  • Have a list on the right portraying all the available form elements structured by type in categories. Users will drag-and-drop these into their respective places.
  • Every element is inserted into its own block which contains a Title and an optional Description/hint/subtitle of what it is supposed to represent
  • Elements will have the ability to be moved/edited once added by having a menu appear once they are clicked (menu containing edition/update/delete options/fields)
  • Once an element is updated, the final form is updated
  • Import/export functionality for the form data/submissions
  • Email notifications(can be disabled): both for the creator of the form to receive a notification once a submission occurs or (optionally) a day/week summary of submissions. As for user, notifications on updated of the state of his submission (accepted/rejected/ etc )
  • Privacy setting on forms
  • Have an API for accessing the data
  • Each submission is stored in its own document
  • Each form is stored in its own space ( 1forms/space only )
• Step 3 - Customize homepage presentation
  • List entries on the homepage: true/false
  • Entries livetable fields: (have a dynamically created list of the form's fields)
  • Entries livetable options:
    • Enable excel support on livetable: true/false
    • Hide edit buttons on homepage: true/false

Alternatives:

Detailed Functionality

• Element types/categories:
  • Standard
    • Heading
    • Textbox
    • Textarea
    • Number
    • Dropdown ( with option for allowing multiple selections )
    • Check box
    • Radio button
  • Pickers
    • Date
    • Time
    • Image
    • Attachment
    • Single Page
    • Multiple Pages (can't this and the above be included in a "Page" input which will have an option for "allow multiple selections" or not?)
    • Single User
    • Multiple Users ( same question as single/multiple pages )
  • Advanced
    • Single static list
    • Multiple static list
    • Single Database list
    • Multiple Database lis
• Elements global options:
  • Title:
  • Subtitle/Hint
  • Required: true/false
  • Error message
• Elements specific options:
  • Text elements:
    • Default:
    • Placeholder (html5):
    • Min length: 0
    • Max length: 0 (infinite)
    • Validation: have a list of predefined validation types like email, numbers only, text, date only and (maybe) also allow a regexp pattern?
  • Multiple list elements:
    • Min selections: 0
    • Max selections: 0(infinite)
  • File upload elements:
    • Size
    • Extension
• Submitting data
  • Users fill in the required field and hit submit. Error notifications are displayed if required otherwise a success message is outputted
• Viewing submissions
  • Submissions will be visible/sortable/exportable via the livetable
• Settings
  • General
    • Form Name
    • Form Owner (allow affiliates to send notifications to multiple adresses?)
    • Form Description
    • Form status: Open/Closed
  • Privacy settings for the form
    • Public
    • Visible for specific users/group of users
  • Notifications
    • New Submission Notification: Instant/Daily/Weekly/None
• Search
  • It is done via the livetable

Suggestions

(advanced) Conditional layout: Have a different form depending on previous selected options. i.e. You have a Radio list to select gender and have certain field appear/disappear depending on if the user is a male of female

Further Work

Technicalities

Two classes will be used: FormClass and SubmissionClass

• A Form is a document with an object of FormClass attached. When a form is added a space is also created which will contain the form document and all its submission documents
• A Submission is a document with an object of SubmissionClass attached. Every time a submission is made/modified the Property specific to that input is also made/modified in the Form document (i.e. you drag a textArea into the form and set its options => a textarea Property is also created in the Form document)

FormClass Properties:

• name (Name: text): the title of the form
• description (Description: text): the description of the form
• privacy (Privacy: static list): set the calendar to be public(visible to everyone) or visible to specific users
• shareList (Share Form: user list): if privacy is set to visible for specific users, this list will contain the users who can view it
• owner (Owner: user): the user who owns the calendar

Form class sheets:

• FormViewSheet: contains the form and all its elements