We implemented a Deal.AI and so can you!

We setup an AI Suite of Tools in our subscription and it is really cool.  If you click here you can see the way we make the AI Suite of Tools available via our $15/month subscription and how to setup a Chatbot.

You can checkout the Deal.AI Business White Label that we use inside of our subscription via our Affiliate Link with them.  For just under $40/month and then $6/month per user, you can also sell AI.  Deal.AI is really popular right now.

We have a programmer who can do the same subscription management integration for you that she did for us in it’s basics.  You have to decide on the subscription management system and she is somebody who we recommend highly.  Just contact me at James@DocupletionForms.com if you are interested in setting up your own AI Reseller.

You can use a WordPress Subscription from us on your own cPanel on our Server for just $12/month and it comes with a Rackspace Email.  We love this stuff and would love to help you see how what we do has parts that you can really dig in and get into.  Checkout our Instructional Pages by clicking here.

Vimeo and Screencast-O-Matic go together well.

Screencast-O-Matic is a really easy to use Screen Capture Video Subscription that lets you capture what you are doing on your computer so that you can publish it in a meaningful way for your Clients.  Vimeo has a really amazing feature that allows you to replace a video so that wherever you have the video embedded or linked to on the internet will after replacing the video show the new video with which you have replaced the previous video.

Rackspace Microsoft365 Reseller

We have added Rackspace’s Microsoft365 Business Partner Reseller Package to our upgraded subscription.  You set everything up inside of the program where it says “WHMCS” at the top of the menu bar.

We made Conditional Webhooks this year and are finishing our automatic document selection and completion utility functionality of the “Merge”

Our WordPress setup is automatic using WHMCS. 

We are finishing adding the CRM, Auto-Email.

After all of that we are finishing our Single Sign-On then our RetainerCrypto.Online Crypto Utility Token.

hidden fields for tracking

This is a simple 3-step instructional to show you how to setup a “hidden field” with a proper “label” and “alias” for tracking.  

  1. build a form with a hidden field and give an appropriate label name and set the alias to a proper term for tracking.
  2. add a ? followed by the alias, an = sign and then the tracking term.
  3. then when somebody submits a form like the one above, the submission will contain the term from after the = sign, in this example “turner”.

 

 

28 FREE Addons!

These Addons are all FREE!  We are working on making a set of Instructions for the Addons.  They are 100% FREE!  We are working on adding a CRM and an Automatic Email Series Functionality which are going to be a part of the $5 Monthly Subscription because you will be required to connect the Email Functionality to an outside SMTP (we recommend SendGrid.com) which will cost around $10-$15 Monthly, but it is a normal thing to need in the world of online integration.  After a while we are planning on making the same Email Functionality a part of what will become our $35 Monthly Subscription but with the additional option of using our PowerMTA Server so that you do not need an SMTP Server Subscription.  We will keep you posted as we make progress.

RetainerCrypto.Online is going to be for Retainer Payments Online!

RetainerCrypto.Online is going to be used to pay for law services and similar services.

RetainerCrypto.Online or RCO is going to be used in conjunction with law and/or legal and/or related types of services to commit an amount of funds to a transaction, but to only fully transfer part of the funds to the agent receiving the funds and providing service. If there is a dispute of a disbursement, the agent can be replaced and the client can begin to pay them with the undisputed funds. The client’s case profile will also anonymously go onto a case board with the basic description of the case and attorneys and other agents will compete to become the client’s new agent.

We are first going to start with just a simple ERC20 Token and ICO with a name very similar to RCO and have a link to the ICO Website from this page. We are going to make it possible to pay retainers through DocupletionForms.com using this ERC20 Token, and then we are going to build the final smart contract that will allow for the above described type of transactions where it will be possible to replace the person receiving the funds.

The project is designed to provide an alternative to Trust Accounting and/or the Escrow Process. The final stage is going to be our own BlockChain Crypto Network with Smart Contracts that function the same way as our previous RCO Ethereum Network Crypto Coin did.  The network we propose making will be a Stable Coin Network based on the USD.  Thank you for reading about RCO and RCO ERC20.

 

 

 

 

 

 

Report Builder

Introduction

Report Builder allows you to see the data collected by a form.

Note: You can only create a report per form.

Create my first report

To create your first report go to Form Manager. Then, click on the Actions button and select the Submission Report option.

A report is made of multiple charts. You can create as many charts as you have fields in your Form. When finished editing, you should click on the Save report button.

Add a chart

To create a chart:

  1. Click the Add chart button
  2. Fill the Title field
  3. Select the Type of chart
  4. Select the Field from which to get data
  5. Click Save

Your chart has been added. Now you just need to Save the report.

Edit a chart

To edit a chart:

  1. Click the Edit button. Note that the report has now a yellow background and the Edit button now says Stop. In addition, all charts must show a pencil icon (for editing) and X (to delete).
  2. Click the pencil icon of the chart to edit.
  3. In the form that appears, change the data you need.

  1. Click Save
  2. When the chart is reloaded, press the Stop button.

Your chart has been edited. Now you just need to Save the report.

Delete a chart

  1. Click the Edit button. Note that the report has now a yellow background and the Edit button now says Stop. In addition, all charts must show a pencil icon (for editing) and X (to delete).
  2. Click on the X icon and the chart will disappear.
  3. When the chart disappears, press the Stop button

Your chart has been deleted. Now you just need to Save the report.

Resize a chart

  1. Click the Edit button. Note that the report has now a yellow background and the Edit button now says Stop. And when you hover the mouse over a chart an icon will appear in lower right part to resize the it.
  2. Click on the icon to resize the chart and drag to make it bigger or smaller.

  1. When the chart has the size you need, press the Stop button.

Your chart has been resized. Now you just need to Save the report.

Save the report

To save the report:

  1. Be sure you are not in Edit view. Click the Stop button if this still appears.
  2. Press the Save report button.
  3. A message will appear confirming that the report has been saved.

Interacting with the report

Charts can interact with one another. When you click one of them you will see how the others change to show the chart element information you clicked.

Reset a report

If you want to create a new report, you can press the Reset button. You will notice that all charts have disappeared. Now you just need to Save the report.

Form Widget (The embed code)

Introduction

Embed code are a few lines of html and javascript that you can use to embed an Docupletionforms’ form into your own website. This is the easiest way to display a form on your site and the method least susceptible to errors. But also, one of the most important things about the form widget is that every time you make a change to your form in the form builder, the embedded form will automatically update.

The Form Widget is designed to work on any web page. The Embed code basically creates an iFrame on the fly and the form is loaded in it. And, since it creates the iFrame, it can also resize it and that means there’s no need to update the code every time you make some change. But also, when you keep a form inside an iFrame, you also prevents it from conflicting with existing JavaScript or CSS elements on your page.

Which Form Embed Code Should I Use?

Right now Docupletionforms offers two options for publishing a form in your web site:

  1. Embed with Design: Lets you publish the form with the theme that has been applied to the form.
  2. Embed without design: Lets you publish the form without any theme, even if you have applied one to your form.

Usually, the first option is the one you should use.

Form Widget Setting

The Embed code has two parts:

  1. An HTML code that displays the default content if the user accesses the form when JavaScript is disabled in his browser. By default, a link to your form within a DIV element is displayed.
  2. A Javascript code that is responsible for displaying the form and initialize the Form Tracker (if Analytics is enabled).

The embed code allows you to set some options of the form on the fly:

  • ID: Form’s ID number in the application. For example: 'id': 132
  • Container: ID of the HTML element where the form’s iframe will be inserted. By default, points to the DIV ID that contains the link to the form. For example: 'container': 'c132'
  • Width: Specifies the width of the form’s iframe. For example: 'width': '100%'
  • Height: Specifies the height of the form’s iframe. Usually, the embed code comes set with a value in pixels. This value is calculated by the Form Builder at the time of its creation. For example: 'height': '846px'
  • Auto Resize: By default, is enabled. Indicates whether the iframe can automatically resize to the real height of the form. For example, when validation messages are shown. If set to false, the form does not resize and its height will be defined in the “height” option. For example: 'autoResize': !0
  • Theme: By default, is enabled. Is a integer value (1 or 0) that lets you enable or disable a theme on the fly. For example: 'theme': 1
  • Custom JS: By default, is enabled. Is a integer value (1 or 0) that lets you enable or disable the loading of external javascript files on the fly. For example: 'customJS': 1
  • Record: By default, is enabled. Is a integer value (1 or 0) that lets you enable or disable the Form Tracker on the fly. For example: 'record': 1
  • Form: Specifies the path to the form’s embed. It contains no parameters.
  • addToOffsetTop: By default, is 0. Add or subtract a number of pixels to OffsetTop before calculating the form location. This allows correct the form location when html elements on the website (like a header) have the CSS property: “fixed”. For example: 'addToOffsetTop': '-60'
  • Default Values: If you want to pre-fill form fields with default values, you can use this option. Default Values ??is a JSON object where your key is the id of the form field and its value is the content of the field. For example:
'defaultValues': {
    'text_0': 'This is my default value'
}

Note that fields of type checkbox and radio button are selected by using boolean values. For example:

'defaultValues': {
    'text_0': 'This is my default value',
    'checkbox_0': true
}

Interacting with the Form via JavaScript

The Form Widget contains a large number of features and options that can be configured inside an external JavaScript File.

Note: To load a JavaScript File you must go to Forms -> Actions -> Settings -> UI Settings.

By default, a jQuery object is available. So you can interact with the Form in a very simple way by using the following lines of code:

$( document ).ready(function() {
  // Here we can interact with the Form
});

The Form element

The Form element – formEl – is a jQuery object to which you can access for get information and/or manipulate it directly. For example, we’re going to know the high of our form with the following lines of code:

$( document ).ready(function() {?
  console.log('The form height is', formEl.height());?
});

Listening for Events

Certain events are triggered when the Form does something.

  • view: This event is triggered when a form is viewed.
  • fill: This event is triggered the first time you interact with the form. For example, by fill a text field or select a radio button.
  • error: This event is triggered when the Server threw a validation error.
  • success: This event is triggered when the Form has been submitted successfully.
  • nextStep: This event is triggered each time you progress to the next step in a multi-step form.
  • previousStep: This event is triggered each time you go back one step in a multi-step form.

A very basic example for detecting when a form fail would be:

$( document ).ready(function() {?
    formEl.on('error', function(event){?
            // Track a server validation error?
            // What happens here would be dependent on your analytics product!
?    });?
});

The Event Handlers: previousStep and nextStep

In addition to the events, Docupletionforms offers two event handlers that allow you to go backward and forward a page on a Multi-Step form ready to use using JavaScript. For example, now we’re going to see how to forward a page without pressing the button “Next” using the auto-advance feature.

Auto-Advance in Multi-Step Forms

By default, when you create a Multi-Step Form, two navigation buttons are added automatically: “Previous” and “Next” at the bottom of the form. These buttons allow you to navigate through the form until you reach the last page where usually the Submit button is placed.

Note: Docupletionforms lets you add multiple Submit buttons on different pages or parts of the form.

However, in certain use cases you can may want to advance directly to the next page without pressing any buttons. For this we will make use of the “nextStep” event handler.

Note: Some use cases in which this feature is useful are surveys and/or tests where is not allowed to change response and lets to complete the survey as soon as possible.

For example, with the following lines of code, we are going to tell our Form that each time a radio button is selected, the form will forward to the next page:

$( document ).ready(function() {
    $('input[type=radio]').on('change', nextStep);
});

Finally, if you want to hide the navigation buttons you can add the following lines in the CSS Theme assigned to your form:

.previous, .next {
    display: none !important;
}

Upload Multiple JavaScript and CSS files in our Form

By having the jQuery object, we can make use of jQuery.when().done() to load multiple javascript objects and make use of them once they are ready to use. Let’s see the following example.

Display a jQuery UI DatePicker in a Date field

For example, with the following lines of code we will show a jQuery UI DatePicker in the Date fields of the form:

$( document ).ready(function() {
    $.when(
        $('head').append('<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" type="text/css" />'),
        $.getScript( "//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" ),
        $.Deferred(function( deferred ){
            $( deferred.resolve );
        })
    ).done(function(){
        $('body').css('padding-bottom', '200px'); // Padding for show the datepicker
        $('input[type=date]').each(function () {
            $(this).attr('type', 'text').after(
                $(this).clone().attr('id', this.id + '_alt').attr('name', this.id + '_alt')
                    .datepicker({
                        // Consistent format with the HTML5 picker
                        dateFormat: 'mm/dd/yy',
                        changeMonth: true,
                        changeYear: true,
                        altField: this,
                        altFormat: "yy-mm-dd"
                    })
            )
            .hide();
        });
    });
});

As you can see:

  • We’re loading 2 files within the function when()jquery-ui.css and jquery-ui.min.js.
  • We have inserted a function that will run when the previous two files are loaded on the page within the function done().
  • The function basically runs 3 Instructions:
    1. Find all fields of type “date” and convert each field “date” in “text“.
    2. Clone each Date field in a Text field that displays the DatePicker.
    3. Hides the Date field, because its value will be established automatically by the DatePicker, by the attributes: altField and altFormat.

Theme Manager

Docupletionforms has a tool that let you create themes that can be applied to a form to change their appearance, backgrounds, colors, text type, etc.

Create a Theme

Go to the Theme Manager, by clicking on Themes in the navigation bar. To create a theme, you must:

  1. Click on the Create Theme button
  2. The form to create a theme have 5 fields:
    • Name: The theme name
    • Description: A very brief description of the theme
    • Main Color: The hexadecimal value of a color to identify your theme
    • CSS: Must be a valid CSS
    • Created by: Defines the owner of this theme (Visible by Administrators only).
  3. Click Save

Note: You can select a Form in the Live Preview field to see how the theme applies to your form while you are editing the CSS field.

Edit a Theme

Go to the Theme Manager, by clicking on Themes in the navigation bar. To edit a theme, you must:

  1. Click the Actions button of the Theme to edit
  2. Click Update
  3. Make the changes you need
  4. Click Update

Delete a Theme

Go to the Theme Manager, by clicking on Themes in the navigation bar. To delete a theme, you must:

  1. Click the Actions button of the Theme to edit
  2. Click Delete
  3. A popup window will appear asking to confirm your delete theme decision
  4. Click OK

Note: When you delete a theme, all data related to it will be deleted too. This action cannot be undone.

Assign a Theme to another User

You can assign a theme to another user using the Theme Editor. To assign a theme, you must:

  1. Go to Themes -> Actions -> Update.
  2. In the ‘Created by‘ field, choose the username to which you want to transfer the theme.
  3. Click Update

Apply a Theme to the Form 

You can apply a theme to the form using the Form Manager. Go to this link to see the steps to take.

Submission Manager

Submission Manager let you create, view, edit and delete data collected by your forms. To access the Submission Manager, you must go to Form Manager and click on the form name. From there click on Submission (Paper Airplane icon). Now you can check, edit or delete your submissions.

The Submission Manager, unlike other managers of the application, offers more features to adapt flexibly to the data collected by your forms.

These are some Submission Manager features you should consider:

  • Navigation: Manager displays submissions in tabular form. In the table upper cell the form field label is displayed and then the submission data corresponding to that field. Submissions are sorted by creation date (when they were sent). You can sort your submissions by clicking on the cell “Submitted”. Also the number of submissions displayed per page is defined according to the number of rows for the entire application, default is five. To view more submissions, you can use the Next and Previous buttons to go forward or backward.
  • Show / Hide columns: You will see a button with a Table icon to the search box right. If you hover the mouse over it, the message “Show / Hide Columns” appears. If you click on this button, a list with the name of each column is displayed, remove the check of a name and the column is hidden, add a check to a name and the column is displayed. The only thing to keep in mind at this point is that you cannot hide the “Checkbox”, “Submitted” and “Actions” columns. And also, they must show at least two fields. If your form has many fields, use this feature to organize your manager to your preference.
  • Resize columns: If your form has a large number of fields, display them all can make the data look too close together. Use this option to expand the width of the columns to a predefined minimum. You should note that Docupletionforms has a responsive design, so those fields that exceed the width of the page will be hidden. To view them you will be able to scroll horizontally.
  • Reset the Manager: If you have made modifications in the manager, for example, hiding columns. You can return to the default view by clicking on the “Reset” button.
  • New submissions: Submissions with the “new” label next to the date are those unread. Once you enter to read the submission, the label “new” will disappear.
  • Bulk actions: If you need, you can “delete” or “mark as read” or “mark as unread” multiple submissions at a time. For this, check the checkbox of each submission to modify and then click the top right button (Checkbox Checked Icon). It will show a menu with two options: Delete, Mark as Read and Mark as Unread. Click on the required action. You should note that to eliminate submissions, a popup will appear asking you to confirm your decision to delete. When you click OK, submissions will be deleted. This action cannot be undone.

Viewing a Submission Record

When you click on a entry of the Submission Manager, a vertical table with all information collected will be displayed. By default, this entry is in read-only mode. To edit the entry, continue reading until you find the “Editing a Submission” section.

Submission information is divided in three sections:

  1. Submission Details: Shows the information collected by your form fields.
  2. Sender Information: Shows sender information collected by the application. Including country, city and google map.
  3. Additional Information: Displays the date and time when the Submission was made. If it was made or updated by a user logged into Docupletionforms, the username will appear.

Note: Leave a comment about the submission. Comments can only be viewed in the Submission Manager—they aren’t included in exports.

Editing a Submission

To edit a Submission, go to the Submission Manager. Then, perform the following steps:

  1. Click on the submission to edit.
  2. You will see the Submission Information and at the right top see the “Edit” (pencil icon) button.
  3. Click the Edit button.
  4. The vertical table will become a similar form than the one you have created.
  5. Make the changes you need
  6. Submit the Form

Note: Keep in mind that when you edit an item, the data related to that submission will be overwritten permanently.

Create a Submission

To edit a submission, go to the Submission Manager. Then, perform the following steps:

  1. Click the Add submission button (icon with the plus sign)
  2. You will see a similar form than the one you have created.
  3. Make the changes you need
  4. Submit the Form
  5. The new Submission will appear in the Submission Manager.

Deleting Submissions

To delete a submission, go to the Submission Manager. Then, perform the following steps:

  1. Click on the submission you want to delete
  2. Click on the Delete red button (trash can icon) at the top right.
  3. A pop-up will appear asking you to confirm your decision to delete the submission.
  4. Click OK.

Note: Keep in mind that when you delete an item, the data related to that submission (including attachments) will be removed permanently.

Printing a Submission

To print a Submission, go to the Submission Manager. Then, perform the following steps:

  1. Click on the submission to print.
  2. You will see the Submission Information and at the right top see the “Print” (printer icon) button.
  3. Click the Print button.
  4. The page preview to print will be displayed in black and white with submission details
  5. Make the changes you prefer in the printer dialog window
  6. Click on ‘print’

Filtering Submissions

To filter the data collected by the form you must select the Date Range and click the “Filter” button.

Exporting Submissions

To export the data collected by the form you must select the Date Range and click the “Export” button.

Then select the format of the file to be generated:

  • Export as CSV
  • Export as MS Excel

 

 

 

 

 

 

 

 

Searching Submissions

To search, enter the search criteria in the search box located at the top of the Submission Manager. The search engine will return all instances of the word found in all the collected fields.

File Management

You can manage files sent with your forms. Basically file management allows to:

  • View sent files associated with the field used (label).
  • Upload files when creating Form Submissions using the Submission Manager.
  • Update uploaded files.
  • Delete files

Important! When trying to update a Submission file made before the upgrade to version 1.3.6, older files will appear at the bottom of the list of uploaded files. You can remove them when you consider appropriate.

.