Enabled (HTML5/JavaScript)

The Enabled (HTML5/JavaScript) generates a simple HTML snippet to your website, so we recommend it, because this option is easy and handy.

Moreover, embedded form will be automatically updated reflecting changes in your database setup. All built-in TeamDesk functionality such as form behaviors, dynamic column calculationsreference columns and validation rules is supported from the ground up.

When you generate a web-to-record form and set the Enabled (HTML5/JavaScript) option, you can see the following form:

web to record simple.png

The options are described below:

Option

Description

Impersonate as

To design the form in a simple way, you should choose a form adjusted for an existing user. Just select the user name in the dropdown. As a result, the web-to-record form will look and work like the form displayed to the specified user. If you need a unique form, you can create a new user, adjust a form behavior for this user and select the user name in the dropdown.

Button Label

Here you can assign a label to the button that will submit the form data to the database.

After Form Submit

In case you select the Display Message option, the text written in the Message field will be shown, when the button is clicked and the data is submitted.

If the Redirect to URL option is set, you are able to specify the URL referring to a web-page or other web-to-record form when the button is clicked and the data is submitted.

Message

Write the message being displayed as a confirmation message.


After you save the changes, the HTML code will be generated.

A screenshot of a social media post

Description automatically generated

Declarative passing of URL parameters

TeamDesk supports declarative passing of the URL parameters from browser navigation bar into web-to-record form. Therefore you can simply add the following to the end of your web from url:

fid_<column-id>={{url:<parameter-name>}}

Where column-id is an identifier of the column. You can find it in browser URL while viewing column properties in setup section;

<parameter-name> is a URL parameter to take the value from.

For example: You created the “Feedback” table in your database. This table includes two reference columns: “WorkshopID” referring to the Workshops table and the “Email” column referring to the Participants table.

Feedback Table.png

You want to collect workshop feedback of a participant. Such feedback should be collected via web-to-record form and registered as the “Feedback” table record. The web-to-record form can be embedded into your website page or can be kept as an HTML file in database resources. Let’s name this page the Feedback page.

The idea is to send each participants the Feedback page URL comprising WorkshopID and Email of a participant. As the result, when a participant will click on the received URL, these values (WorkshopID and Email) will be inserted into the corresponding fields of the Feedback form automatically.

For instance, the following URL

URL_WorkshopID_Email.png

redirects a participant to this Feedback form:

Feedback Form.png

As you can see, the values kept in the URL are inserted into the “Email” field and into the “WorkshopID” field respectively.

Below is the modified web-to-record form script, that was used in the example:

Modified Script Example.png

To generate a Feedback page URL for each participant, you can create a Formula-URL column. In the provided example we use the following formula:

Picture 112

The Formula-URL column can be shown in a table view. As the result, you can copy the URLs you need or open a necessary Feedback form by clicking on a corresponding URL.

Graphical user interface, table

Description automatically generated


How to set font settings for your web-to-record form

When a web-to-record form script is embedded into your website page, the displayed web-to-record form tries to use font settings from the surrounding page. So, all you need is to set the font for your page.

The Times New Roman font is used by a browser, if nothing is defined.

If you keep a web-page in the database resources and need to set specific font settings, you can add <style> to the <head> tag of your HTML code . For instance:

<style>

dt {font-weight: bold;

}

body, button, input, option, select, table, textarea {

font-family: Verdana,Geneva,Sans-Serif;

line-height: 16px;

font-size: 12px;

}

</style>

In the example the font of the family Verdana,Geneva,Sans-Serif is used for the web-to-record form. Moreover, field names are displayed in bold. You can see the result on the following screenshot:

A screenshot of a social media post

Description automatically generated

Next: Enabled (Pure HTML)