RECOMMENDATION: If you are using a version of The Portal Connector higher than 4.0, we strongly recommend utilizing the MVC based widgets and components to create your site. This documentation is for legacy purposes only and will soon be deprecated.
Widget Type:
Form Widgets
TPC Version:
  • 4.0
barcodelogo
The Bar Code widget will generates a bar code from CRM Attribute data.

Configuration

Basic

Make sure you have a Form with Form Configuration and a TPC Form Layout already attached.

Drag and drop the Bar Code Widget from the Portal Connector tools into the TPC Form Layout and click edit to display the properties prompt.

The Attribute dropdown list allows you to select an attribute for the widget to create a barcode from.

The Encoding Type dropdown list allows you to specify a symbology for a barcode to adhere to. More information on barcode symbology types can be found here and here.

barecode-instructions-1

Widget Properties

Basic Properties

Attribute

The Attribute drop down list will allow you to change the data field that this widget will save the user’s input to (For example, a CRM Text Field with an Attribute of Account Name will save its input to the Account Name data field).

Encoding Type

The symbology for the the barcode to adhere to.

There are a number of encoding types available.

Find out more about Encodings.

Hidden

The Hidden checkbox will hide the widget from the page when checked.

Tool Tip

The Tool Tip allows you to add a description or Hint to your widget.

ToolTipPosition

This property determines the position of the tool tip. By default this property is set to "Auto". You can change this to Left , Right , Top , Bottom. 

Background

The Background advanced property allows you to set the background colour of a widget.

BorderColor

The BorderColor advanced property allows you to set the border color of a widget.

BorderDashType

The BorderDashType advanced property allows you to set the appearance of a border. Applicable options include: None, hidden, dotted, dashed, solid, double, groove, ridge inset, and outset.

More information on these styles can be found here.

BorderWidth

The BorderWidth advanced property allows you to set the border width of a widget.

TextColor

You can set the color of the text by changing the value of this property

TextFont

change the font family and every property related to the font styles can be changed by changing this property.
ie:"16px Consolas, Monaco, Sans Mono, monospace, sans-serif"

Color

The Color advanced property allows you to set the font color of a widget.

Padding

The Padding advanced property allows you to set the padding of a widget.

Height

The Height property determines the height of the widget element in pixels.

Width

The Width property allows you to define the width of a widget in pixels.

Show Text

display text on the barcode

IsHidden

Allows you to hide the widget when this property is set to true

TextMargin

The TextMargin advanced property allows you to set the text margin of a widget.

Advanced Properties

Advanced properties provide additional functionality. They can be accessed by clicking on the "Advanced" Button in the bottom right corner of the widget designer.

Attribute

The Attribute drop down list will allow you to change the data field that this widget will save the user’s input to (For example, a CRM Text Field with an Attribute of Account Name will save its input to the Account Name data field).

Encoding Type

The symbology for the the barcode to adhere to.

There are a number of encoding types available.

Find out more about Encodings.

Hidden

The Hidden checkbox will hide the widget from the page when checked.

Tool Tip

The Tool Tip allows you to add a description or Hint to your widget.

ToolTipPosition

This property determines the position of the tool tip. By default this property is set to "Auto". You can change this to Left , Right , Top , Bottom. 

Background

The Background advanced property allows you to set the background colour of a widget.

BorderColor

The BorderColor advanced property allows you to set the border color of a widget.

BorderDashType

The BorderDashType advanced property allows you to set the appearance of a border. Applicable options include: None, hidden, dotted, dashed, solid, double, groove, ridge inset, and outset.

More information on these styles can be found here.

BorderWidth

The BorderWidth advanced property allows you to set the border width of a widget.

TextColor

You can set the color of the text by changing the value of this property

TextFont

change the font family and every property related to the font styles can be changed by changing this property.
ie:"16px Consolas, Monaco, Sans Mono, monospace, sans-serif"

Color

The Color advanced property allows you to set the font color of a widget.

Padding

The Padding advanced property allows you to set the padding of a widget.

Height

The Height property determines the height of the widget element in pixels.

Width

The Width property allows you to define the width of a widget in pixels.

Show Text

display text on the barcode

IsHidden

Allows you to hide the widget when this property is set to true

TextMargin

The TextMargin advanced property allows you to set the text margin of a widget.

API

enable()

Enables the widget on the form.

Returns

None

disable()

Disables the widget on the form.

Returns

None

get_type()

Returns the widget type.

Returns

String

clear()

Clears the value of the widget.

Returns

None

get_container()

Returns the container element of the widget.     

Returns

jQuery Object     

get_element()

Returns the element of the widget.

Returns

jQuery Object

get_input()

Returns the input element of the widget.

Returns

JQuery Object

get_value()

Returns the value of the attribute that the barcode widget has been configured to use.

Returns

String

hide()

Hides the widget from the form.

Returns

None

show()

Shows the widget on the form.

Returns

None

set_background()

Sets the colour of the background. This can be done in a variety of ways.

Returns

None

set_borderColor()

Sets the colour of the border associated with the widget. This can be done in a variety of ways.

Returns

None

set_borderDashType()

Sets the style of the border associated with the widget. Some border dash types include: solid and dotted.

Returns

None

set_borderWidth()

Sets the width of the border associated with the widget.

Returns

None

set_color()

Sets the colour of the widget. In the case of the Barcode widget, this will set the colour of the bars.

Returns

None

set_height()

Sets the height of the widget.

Returns

None

set_paddingBottom()

Sets the bottom padding of the widget.

Returns

None

set_paddingLeft()

Sets the left-side padding of the widget.

Returns

None

set_paddingRight()

Sets the right-side padding of the widget.

Returns

None

set_paddingTop()

Sets the top padding of the widget.

Returns

None

set_renderAs()

Sets the preferred rendering engine. The default value for this is 'svg'. More information on this method can be found here.

Returns

None

set_textColor()

Sets the colour of the text associated with the widget.

Returns

None

set_textFont()

Sets the font of the text associated with the widget.

Returns

None

set_textMarginBottom()

Sets the margin of the text associated with the widget.

Returns

None

set_textMarginLeft()

Sets the left-side margin of the text associated with the widget.

Returns

None

set_textMarginRight()

Sets the right-side margin of the text associated with the widget.

Returns

None

set_textMarginTop()

Sets the top margin of the text associated with the widget.

Returns

None

set_type()

Sets the encoding type of the widget.

Returns

None

set_value()

Sets the value of the widget. In the case of the CRM Barcode widget, a barcode will be rendered based on this set value.

Returns

None

set_width()

Sets the width of the widget.

Returns

None

showChecksum()

Shows or hides the checksum associated with the widget. The default value for this is 'false'.

Returns

None

showText()

Shows or hides the text associated with the widget. The default value for this is 'true'.

Returns

None

toggle()

Toggles the visibility of the widget on the form.

Returns

None

readonly()

Sets the widget state to read only.

Returns

None