Front End – The extension in the Dashboard
The front end, also known as the extension integrated in the dashboard, is where the magic happens. This is the interface many users, both dashboard creators and as well as dashboard users, will see and interact with. The front end is designed with usability and flexibility on top of mind. Dashboard designers can control the look and feel of the extension and use the form builder to adapt the user entry forms to their needs.
The behavior of the instance of the WriteBackExtreme extension in the dashboard can be configured in multiple ways. For example, you can choose between an extension as a tiled dashboard container (classic) or you can display the extension in a floating (pop-up) container and toggle it automatically with a button or mark selection. Whatever nature of your use-case, Write Back Extreme has got it covered!
Dashboard requirements
There are 2 requirements for the dashboard in order for the extension to work.
- The extension needs a worksheet which contains the username of the logged in user.
- Depending on the module you are using the extension needs a worksheet which acts as a trigger for the extension. Username can also be within this worksheet.
Both requirements are prompted to the dashboard designer when using the extension on the first occasion in the dashboard. The sections below will explain how to use the WriteBackExtreme extension in your dashboard (once you have configured at least one schema in the Management Console).
You will need the logged in user
If you want to integrate the WriteBackExtreme extension in your dashboard, you need to make sure the extension can access the username of the logged in user. This is the first requirement you need to meet. The dashboard you want to use probably already has different sheets in it. Pick one sheet and add a calculated field with the Tableau Function USERNAME() to the detail of the marks pane of that sheet.
The calculation is a default Tableau Calculation like in the screenshot below. In this case the calculated field is called “Logged In User” and you can see it is added to the detail of my marks pane. This screenshot is taken form the Demo workbook that is also available on our free trial download page (register here).
So before you can use the WriteBackExtreme (WBE) Extension you need to:
- Create a calculated field containing the Tableau Function: USERNAME()
- Add the calculated field to the detail of your marks pane on at least one sheet
Once you have the username available on a sheet in your dashboard, you can start to add the extension to your dashboard. In the example below the Demo workbook for Write Back Extreme is used (available here)
Once the Username is available in the dashboard you can start to integrate the WBE extension in your dashboard. Below an animated GIF of the steps, performed in the WBE Gallery demo workbook on the DATA HELPER example dashboard.
Add the Extension to your dashboard
The steps to follow are:
- Drag the Tableau dashboard object “Extension” to the container where you want to place your extension
- You will be prompted to select a trex file. Use your explorer to find the Write Back Extreme extensions trex file (try it for free)
- The extension will load in the container of your dashboard and will prompt you to specify the user information
- Select the sheet where you added the calculated field with the USERNAME() function from above
- Select the calculated field (in this example the field “Logged In User”)
- You will be prompted to connect to a schema for this instance. Select the schema you have prepared for your use case in the Management Console
- Once you selected the schema you will be prompted what sheet you want to connect to and what dimension will trigger the extension (on mark selection). In the example we used a “DATA HELPER” schema that does not need a connection to an existing sheet nor dimension.
- Now you can complete the configuration of the extension by pressing “Save”. In the example we used a schema that already contained entries (from the Gallery Demo workbook”. Otherwise the list of entries would be empty of course
Done!
You are ready to start configuring the extension. Let us take you through the configuration options within WriteBackExtreme.
Configure the extension
If your extension is now integrated in the dashboard you can start fine tune the look and feel and behavior of the extension. First of all we will edit the connection to connect it to a sheet that uses the same Database Table as the connected schema. This is the “Missing Orders” sheet in the dashboard. All records are stored with a unique field called “id” so in the next animated GIF we will connect the existing sheet “Missing Orders” to the extension with the unique id as the connecting dimension.
The steps to follow are:
- Click on the configuration wheel of the extension
- Clik on the pencil
- Select the sheet to connect to (in this example the Missing Orders sheet)
- Select the field to connect to (in this exampe the field “id” which is also present as a hidden column on the “Missing Orders” sheet
Now the extension is connected and interacting with a sheet in the dashboard.
General Tab
We will walk you through all the tabs in the configure screen, starting with the general tab. The general tab is where you will be able to connect to your schemas, style your extension to match your dashboards brand and more.
Schemas
The Schemas tab is where you connect to your schema created in the management console. You can add multiple schemas here to connect to different worksheets. Add, edit and delete schemas at this screen.
Use the blue ‘+ New’ button to connect to your schema. You will be presented with a form where you can start by giving the schema a title and a description. Describe to your users what the extension is being used for in the description. Connect to your schema, choose the sheet you want this schema to be connected to and then the unique identifier field of that sheet. You are now connected!
Repeat these steps to add more schemas, all will be shown under this tab.
Show the extension in a popup window
Sometimes you need an instance of your WriteBackExtreme extension in a dashboard but you don’t want it to take up valuable dashboard space. With the Pop-Up function of the Write Back Extreme extension you can show the extension in a modal window once you triggered it by a mark selection (or button).
Below an animated gif of how to show the ADD DATA module in a pop-up window. In the example we use the Gallery workbook,, you can register for a free trial here.
Steps to be taken when you want to show the WriteBackExtreme extension in a pop up window.
- Create a new floating container (Either Horizontal or Vertical)
- Place the new floating container over the dashboard area where you want to show the WriteBackExtreme extension in a pop-up
- Drag the Extension container to the new Floating container
- Adjust the size of the container to meet your lay-out wishes
- Open the configuration screen of the extension and on the first tab select “Pop Up”
- Select the second recommended option to show the extension in a floating container
- Select the newly created Vertical (or Horizontal) container
- Press the “Save” button on the top of the modal configuration window
- Once the settings are stored close the configuration window and ‘Reload’ the extension for the changes to take effect.
Tabs
WriteBackExtreme allows multiple schemas to be connected to one window. This allows users to connect to multiple worksheets using different schemas. These will be shown as different tabs within WriteBackExtreme.
Dashboard parameter actions
Dashboard parameter actions will populate the extension with your connected schema when selecting your mark. Connect different schemas to different worksheets and have them appear in one window. Follow our video tutorial to set this up and see the great value it will bring.
Mapping configuration
Use the Add Data module to add comments linked to a dimension within your worksheet, if that dimension is available within multiple worksheets the comment will be shown within WriteBackExtreme. To set this up head to our blog.
Worksheet-Schema Tab
The Worksheet- schema tab keeps you in control of your schema. The dashboard creators can format the style of the form and the behavior of the schema from this tab. You will see different options depending on the module you’re connected to.
General (All modules)
Show title/description
In the general tab of the worksheet schema, this allows you to show/hide the title and description of your schema. Let your users know what the extensions use is for, or not, it’s your dashboard!
Refresh Mode
Enable a refresh on the data source when the user saves changes. This ensures data is always up to date after a save.
Refresh options (Data Helper & Add Data Only)
When saving any changes within your form, the extension will automatically refresh when enabling. It’s also possible to show the refresh button within the extension, this will help when refreshing the data takes more time. Note: These features only work if the data helper sheet is connected with a worksheet!
Refresh Button (Data Helper & Add Data Only)
Add a refresh button to your window. This can be useful for when refreshing data takes more time.
General Layout options for Add Data
Clearing the selection will…
Whenever you select a mark in the connected sheet, the extension will filter and show the appropriate data, decide whether to show all data or exclude when clearing your selection.
Allow Global Comments
WriteBackExtreme allows you to add comments and data to one, none or multiple selected records in your dashboard. Dashboard creators can now force their users to only add data on a single data point. For example this will prevent any loose comments not linked to a specific mark. More control for the creator resulting in clean and focused dashboards.
Allow Multi select on marks
Enable the option to add data to multiple marks (data points) at once. This will create 1 row of data in the schema with multiple mapping rows. For example if you would like to comment on the top 3 selling items at once, highlight each one, add your comment highlighting the good sales!
Filter options
Use these options to limit the amount of rows visible in the extension. Filter on certain columns you wish to have present in the extension, add more if required. Filter on date so show a certain amount of data from the last 30 days for example. Also possible to filter the top rows by adding a value in the box.
General Layout options for Data Correction
Layout
Change the layout form to a vertical layout which would help if you would want to create a form. The default layout is horizontal where fields can be side by side, allowing for a more compact form.
Clearing the selection will…
Whenever you select a mark in the connected sheet, the extension will filter and show the appropriate data. Decide whether to show all data or not.
Interpolate & Bulk Edit
Data Correction can be used to clean data, enable power tools to bulk edit your values. There’s possibilities such as adding, subtracting, dividing and multiplying with a chosen value. If there are empty values use our powerful Interpolate tool! Sometimes you want to fill in the missing data points automatically, based on related data. This is something the build-in interpolation function can help you with. Interpolation is a method of constructing new datapoints within the range of a set of known datapoints. To use the interpolation function of the Data Correction module, select multiple fields. You must provide data that can be used to interpolate, i.e. the datapoint prior and the datapoint latter to the missing datapoints. When you selected the correct datapoints, you can use the calculator icon above the column and select “Interpolate” to fill in the missing datapoints.
Refresh data sources on save
Toggle a refresh of all relevant data sources when the user saves changes. This will keep all connected data sources up to date on each save.
Editable Conditions
Allow editing records only when a condition is met
Set conditions to allow or deny users the ability to edit a row in WriteBackExtreme, if this condition isn’t met then the logged in user will not be able to edit the comment. For example if the status of the row is ‘Current’ then that row can be editable, all rows that do not have a current status will be uneditable, or if you wish to have comments only about ‘Phones’ this is also possible. Conditions for editing can be based on either a data source from your dashboard, or on existing records within the underlaying WriteBackExtreme schema.
Allow adding records only when a condition is met
There may be situations where you want to restrict the ability of your users to add new records in WriteBackExtreme. For example, you only want your users to be able to add a comment to data within the current fiscal period, or based on the total amount of sales related to a selected mark.
Set your condition using the editor in the “worksheet-schema | general” tab in the WriteBackExtreme configuration screen. In this example, we will limit the adding of records to any mark with SUM(Sales) above 250000. This will allow your users to only add comments on marks where SUM(Sales) exceeds US$250.000.
As seen in the example below, the “add record” button (the pink + plus sign) is disabled when a mark is selected that does not match the condition setup previously (SUM(Sales) must exceed US$250.000).
Field Formatting Tab
There are many field options to have in your form. The field types are Single Line, Paragraph, Number, Multi Select, Boolean and Date fields. Here you can change the appearance, layout and behavior of the fields in the form.
Type of form field – Single Line
Creating a schema in your WriteBackExtreme management console using the Single line text as your Field Type will give you flexibility in the front end when configuring the type of form field.
Map input, Emoticons and of course text can be used. If you create a single line column in the management console you can change the layout to a Map component style. You can use specific options for the map like a default location and more. Map input allows you to use the built in mapping feature within your form to pinpoint an exact location which will be written back to your database. A super easy and powerful feature. Use the emoticons to react on sales for an example and add some color to your dashboard!
Email Validation
When your data set holds email addresses, or you wish to add email address from WriteBackExtreme to your database you can now validate that field. The email field must be validated on basic email syntaxes like [email protected] It’s not possible to write any data back that isn’t validated.
Number
Use the number field to show numbers, a percentage and currency in the form.
Rating
A very good use case for WriteBackExtreme is allowing users to rate certain dashboards using our star method. The Rating option presents a stars where users can click on each star which will then write back the score to your table, for example. Configure how many stars will be shown, size and spacing.
Slider
Convert the number to a slider, this would be ideal for users to use if a precise range isn’t necessary and an approximate would suffice.
Progress bar
As it says on the tin, users can update their dashboards using the progress bar to share their projects progress. A clear indication of how well your projects are doing.
Boolean
If your form requires a simple true or false answer then use the Boolean field type. This can be formatted to display a simple checkbox or a switch, to show a completed field in your form. Use the Boolean field type to allow your users can give a clear indication of their thoughts by giving it a big thumbs up or down! Edit the color under format so when the users check a clear color will be shown in the form.
Date/Datetime
When creating a schema you will get the option to include the time to be shown in the form. Format the label to show what’s being displayed in the form. It’s now possible to auto populate an updated_at and created_at field. For updated_at it will every write action generate a new timestamp and store it in this column and for created_at; will only set an timestamp on create of a new record. When updated_at is tick created_at will automatically be disabled. In the schema field we keep an option for auto_datetime_updated and auto_datetime_created, both are booleans.
Use the Form Builder
With the flexible Form Builder of WriteBackExtreme you can control what the form for your WriteBack users looks like. You control what fields are mandatory, what fields are shown in the form and what overview look like.
First of all it is important to know that the properties of the fields in your schema (Created in the Management Console, check this section to learn more on the Management Console and creating/managing schemas) are of great influence in using the Form Builder.
- Non nullable fields in your schema are always mandatory fields in your Form Builder. If you want to use a non mandatory field in your form, make sure it is ‘nullable’ in your underlying schema.
- Field types are set in the Schema and cannot be changed with the Form Builder. You cannot change a number field into a text field with the Form Builder.
The sections below will cover these basic Form Builder options:
- Change the order of the fields
- Set column width in the form
- Show Hide fields in the overview and/or edit forms
- Enable / Disable mandatory fields
We will use the WriteBackExtreme Gallery demo workbook with the DATA HELPER dashboard to illustrate the possibilities. You can download a copy of the demo workbook by registering for a free trial over here. For this demonstration we configured the DATA HELPER Demo schema to have a few nullable fields so we can illustrate the usage of mandatory and non mandatory fields in the forms. Learn more about managing your schemas in the Management Console over here.
Change the order of the fields
The steps to change the order of the fields in your forms are:
- Goto the configuration screen of your extension by clicking the Pinwheel and select “CONFIGURE EXTENSION”
- In the modal (pop up) select the “Worksheet-schema” option in the colored horizontal menu bar
- Select the second tab called “Form Builder”
- click on the up/down arrows present for every field to change the order of the fields
- Make sure you press the “Save” button in the top right corner of the colored menu bar to save your changes.
Use mandatory and non mandatory fields
By default all fields being used in the extension are set to Mandatory fields in the entry form. The Form Builder allows you to also mark these fields as non mandatory. You can only set fields to non mandatory in the Form Builder if the fields are nullable in the “Schema” you are using in the extension. Learn more about creating and managing schemas in this section of the Management Console. When a Schema field is “nullable” you can not set it to non mandatory in the Form builder. The form builder will show a pink switch indicating that the field cannot be set to non mandatory.
The steps to change the order of the fields in your forms are:
- Go to the configuration screen of your extension by clicking the Pinwheel and select “CONFIGURE EXTENSION”
- In the modal (pop up) select the “Worksheet-schema” option in the colored horizontal menu bar
- Select the second tab called “Form Builder”
- Change the switches to set fields as “Required” (mandatory) or “Not Required” (non mandatory)
- Make sure you click the “Save” button in the top right corner of the colored menu bar to save your changes.
Show/Hide fields with the Form Builder
The Form Builder allows you to show and hide fields of your underlying schema in the edit and overview forms of your extension. Make sure that hidden Mandatory fields do contain the proper content otherwise you will not be able to store your form entry in the database. You can show/hide any field you want in the edit form of the extension or in the overview (list view) of the extension. Make sure you do not hide forms that require input before storing otherwise you will not be able to save the entry (when a hidden field without content is mandatory) or end up with NULL values.
The steps to change the order of the fields in your forms are:
- Goto the configuration screen of your extension by clciking the Pinwheel and select “CONFIGURE EXTENSION”
- In the modal (pop up) select the “Worksheet-schema” option in the colored horizontal menu bar
- Select the second tab called “Form Builder”
- Change the switches to show or hide a field in the edit form (user input – entry of data) or the overview (list view in the extension that in some occasions is used to show all entries)
- Make sure you click the “Save” button in the top right corner of the colored menu bar to save your changes.
Read Only
It may be important to show fields but for them not to be editable. Enable Read Only on the fields that should be left alone. These fields may have been dynamically filled so editing shouldn’t be a possibility.
Change the width of the fields in the edit form
The steps to change the order of the fields in your forms are:
- Goto the configuration screen of your extension by clciking the Pinwheel and select “CONFIGURE EXTENSION”
- In the modal (pop up) select the “Worksheet-schema” option in the colored horizontal menu bar
- Select the second tab called “Form Builder”
- Change the Width of each field from a preselected drop down
- Make sure you click the “Save” button in the top right corner of the colored menu bar to save your changes.
Use dynamic default values in WriteBackExtreme
Use values that are present in your dashboard and store them in fields of your form. This feature hugely improves your flexibility and control. In this way, you can also gather information on dimensions and measures from your dashboard without user input! To add have this powerful feature, open up the configuration screen within your extension. Click on the Worksheet-schema tab where the list of your schemas will be shown, click on desired schema and open the Form builder tab.
Under ‘Default value’ header is where you will be able to make your values dynamic. Simply click underneath the Default value header on the schema(s) you wish to change to have dynamic values. You will be presented with a pop up window where you can choose between none, static & dynamic values. When choosing dynamic simply choose your desired worksheet and column within that worksheet. NOTE: Make sure that the data type of the selected column is similar to that of the form field. See it in action here: Dynamic values
Now possible to dynamically add when editing too, the values will be pre-filled by clicking the ‘Use default value to override the current value on edit’
Auto populate a dropdown field with values from a sheet on your Tableau Dashboard
An advanced way of formatting a field in your dashboard is to auto populate the content of a dropdown field with values obtained from a (filtered) sheet on your dashboard. If for instance your dashboard uses global filters or you want your users to be able to pick a relevant country/state based on the filtered view in your dashboard, this is an efficient way to show only relevant content in your WriteBackExtreme dropdown field.
The example below shows how you can auto populate a dropdown field to show the States where we actually sold products of a selected Product Sub Category in the dropdown of an annotation form.
For the demo we used the Gallery demo workbook with the “Collaboration Dashboard. This technique of dynamically populating dropdown fields will also work for the other modules and templates. Make sure you have an available Drop Down field in your schema (click here to learn more on creating schemas in the Management Console)
With the Management Console we first created a schema in which we added a “Dropdown Selection” field called “State” which has three default values (California, Texas and Nevada just for demonstration purposes). So by default users are only able to select one of these three states. In the Extensions configuration screen we then use the Field Formatting options to autopopulate the “State” field based on the map with states available in the dashboard. This will overrule the default content of the dropdown and allow you to show the States that are available in the map on the dashboard (either filtered or unfiltered).
To create an auto populating field in your form please make sure you have a Drop Down Select field in your schema. If you do not know how to manage schemas in the Management Console, check this section.
- Go to the configuration screen of your extension by clicking the Pinwheel and select “CONFIGURE EXTENSION”
- In the modal (pop up) select the “Worksheet-schema” option in the colored horizontal menu bar
- Select the second tab called “Field formatting”
- Now select the Drop Down Select field you want to automatically populate. In the example we used the field “State”
- In the Field formatting screen now check the box next to “Enable dynamic population from Tableau”
- Select a worksheet containing the column you want to use as values for the dropdown. In the example we select the worksheet “States”
- Select the column from the selected worksheet in the above step. In the example we selected the column “State”
- Make sure you press the “Save” button in the top right corner of the colored menu bar to save your changes.
- The Drop Down Select field will now be automatically populated with the column “State” from the “States” worksheet