Loading...

Sub-Grid View

Properties API Related

Widget Type:
Form Widgets
TPC Version:
  • 4.0
subgridlogo
The Sub-Grid View is a grid that has the ability to retrieve records with the options of adding new records, editing existing records, or deleting records.

SubgridExample

Configuration

Basic

Make sure you have a CRM Form Configuration and a TPC Form Layout already attached and configured. This would reveal the Attributes available to the Entity Selected in the Form Configuration. 

Drag and drop the Sub-Grid View from The Portal Connector tools into the body of your form and click edit to display the properties prompt.

The Basic settings tab contains a number of options, allowing you to determine if a user is allowed to add, edit, delete, filter, or export records to/from the grid.

Please note that if you enable the Allow Adding Existing Records checkbox an Existing Data Tab will appear.

subgrid-instructions-1

Data

The data tab is where you define a Fetch XML, which will determine the records that the grid will fetch and display. Most attributes defined in the fetch will also appear in the grids' columns.

Existing Data. 

The Existing Data tab will enable you to connect records together. For example, a Contact may become affiliated with an already existing account. By editing the particular record, you can associate this Contact with the existing account without having to do any extra work.

These records will appear in a dropdown list within the grid header.
 


subgrid-instructions-2

Filters

The Filters option allows you to filter the data that is retrieved for the grid.

 


subgrid-instructions-3

Columns

The Columns tab allows you to define what data fields will appear in the Sub-Grid View widget. It works alongside Fetch XML to define new columns for your widget.


subgrid-instructions-4
 

Widget Properties

Basic Properties

CacheData

This property enables/disables CRM data caching. Defaults to false.

AddMissingLinkedEntityIds

Set to true out of the box, this attribute allows you to use the attributes of the link entities in the fetch on your templates, if this is set to false than the Unique Identifier for the Linked Entity will not be automatically added which means you wont be able to use the attributes of the linked entity in your template.

However if you want to return distinct values with your fetchXML, the value of this attribute needs to be false.

Allow Adding Records

The Allow Adding Records checkbox allows users to add records to the CRM Entity that the widget is configured to use. When checked, you will be prompted to choose a page or a form from which the widget will use to add records.

Allow Editing Records

The Allow Editing Records checkbox allows users to edit existing records from the CRM Entity that the widget is configured to use. When checked, you will be prompted to choose a page or a form from which the record will be edited from.

Allow Deleting Records

The Allow Deleting Records checkbox allows users to delete existing records from the CRM Entity that the widget is configured to use.

Allow Exporting Records

The Allow Exporting Records checkbox allows you to export and download the entirety of a CRM Entity in spreadsheet (.xls) format. Please note that this spreadsheet will include all selected data fields as per the BuildXML even if they don't physically appear on the widget.

FetchXML

The FetchXML text area determines what sort of data a widget will be populated with. Clicking the Load Default Fetch option will populate the FetchXML area with a default fetch based on the CRM Entity chosen.  By clicking the Build button, we will be sent to another page in order to determine what the widget will look up. For more information on how to use the FetchXML function, please see the FetchXML Builder How-To.

SubGridSettings

SubGridSettings can be found under Advanced > Model > SubGridSettings.

Property

Description

AddExistingRecordsButtonClass

The CSS class of the Add Existing Records Button.

 

AddExistingRecordsButtonText

The text of the Add Existing Records Button.

 

AddExistingRecordsIconClass

The CSS class of the Add Existing Record Button Icon.

AddExistingRecordsImageClass

The CSS class of the Add Existing Record Button Image.

AddExistingRecordsPlaceholderText

Place holder text of the Add Existing Records text box.

 

AddExistingRecordsCancelButtonClass

The CSS class of the Add Existing Record Cancel Button.

AddExistingRecordsCancelButtonIconClass

The CSS class of the Existing Record Cancel Button Icon.

AddExistingRecordsCancelButtonImageClass

The CSS class of the Add Existing Record Cancel Button Image.

 

AddExistingRecordsCancelButtonText

The text of the Add Existing Record Cancel Button.

 

AddExistingRecordsFinishButtonClass

The CSS class of the Add Existing Record Finish Button.

 

AddExistingRecordsFinishIconClass

The CSS class of the Add Existing Record Finish Button Icon.

AddExistingRecordsFinishImageClass

The CSS class of the Add Existing Record Finish Button Image.

AddExistingRecordsFinishButtonText

The text of the Add Existing Record Finish Button.

ExpandExistingRecordsOnFocus

Expand existing records on focused when this property is enabled.

SelectExistingRecordOnTab

Select the existing record on tab when this property is enabled.

 

GridSettings

GridSettings can be found under Advanced > Model > GridSettings
 

Property

Description

AddRecordButtonClass

The CSS class of the Add Record Button.

AddRecordButtonText

The button text of the Add Record Button.

AddRecordIconClass

The CSS class of the Add Record Icon.

AddRecordImageClass

The class of the Add Recode Image.

 

DeleteRecordButtonClass

The CSS class of the Delete Record Button.

DeleteRecordButtonText

The button text of the Delete Record Button.

DeleteRecordColumnHeaderText

The column header text of the Delete Record Column Header.

DeleteRecordColumnWidth

The width of the Delete Record Colum.

DeleteRecordIconClass

The class of the Delete Record Icon.

DeleteRecordImageClass

The class of the Delete Record Image.

EditRecordButtonClass

The class of the Edit Record Button.

EditRecordButtonText

The text of the Edit Record Button.

EditRecordColumnHeaderText

The column header text of the Edit Record Column Header.

EditRecordColumnWidth

The width of the Edit Record Colum.

EditRecordIconClass

The CSS class of the Edit Record Icon.

EditRecordImageClass

The CSS class of the Edit Record Image.

ExcelExportAllPages

If set to true the grid will export all pages of data.

ExcelExportFileName

Specifies the file name of the exported Excel file.

ExcelExportFilterable

Enables or disables column filtering in the Excel file.

Filterable

If set to true the user can filter the data source using the grid filter menu.

GridHeight

The height of the grid. Numeric values are treated as pixels.

Groupable

If set to true the column will be groupable.

Pageable

If set to true the grid will display a pager.

PageableAllowRefresh

If set to true the pager will display the refresh button. Clicking the refresh button will refresh the grid.

PageableButtonCount

The maximum number of buttons displayed in the numeric pager. The pager will display ellipsis (...) if there are more pages than the specified number.

PageablePageSizes

The number of data items which will be displayed in the grid. Default values are 10,25,50,100, all.

PageSize

The number of data items per page. The property has no default value. That is why to use paging, make sure somepageSizevalue is set.

ReorderableColumns

If set to true the user could reorder the columns by dragging their header cells.

ResizableColumns

If set to true, users can resize columns by dragging the edges (resize handles) of their header cells.

Scrollable

If set to true the grid will display a scrollbar when the total row height (or width) exceeds the grid height (or width).

ServerFiltering

If set to true, the data source will leave the filtering implementation to the remote service.

ServerGrouping

If set to true, the data source will leave the grouping implementation to the remote service.

ServerPaging

If set to true, the data source will leave the data item paging implementation to the remote service.

ServerSorting

If set to true the data source will leave the grouping implementation to the remote service.

ShowColumnMenu

If set to true the grid will display the column menu when the user clicks the chevron icon in the column headers. The column menu allows the user to show and hide columns, filter and sort (if filtering and sorting are enabled).

Sortable

If set to true the user could sort the grid by clicking the column header cells.

VirtualScrolling

If set to true the grid will always display a single page of data. Scrolling would just change the data which is currently displayed.

GridEvents

GridEvents can be found under Advanced > Model > GridSettings > GridEvents

GridEvents Allows you to add events handlers to the Grid. This is a list of the different events available. You pass in a function name to handle the desired event. More documentation of the Kendo grid events can be found in here: https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events 

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. 

EncryptGuids

The EncryptGuids advanced properties determines whether Guids should be encrypted or not. By default this is set to true.

WindowWidth

The WindowWidth advanced property allows you to define a default height for any pop-up windows to use. By default this is set to 1024 pixels. Please note that if the Window Auto Size advanced property is set to true, this property will not apply.

WindowHeight

The WindowHeight advanced property allows you to define a default height for a pop-up window to adhere to. By default this is set to 640 pixels. Please note that if the Window Auto Size advanced property is set to true, this property will not apply.

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.

CacheData

This property enables/disables CRM data caching. Defaults to false.

AddMissingLinkedEntityIds

Set to true out of the box, this attribute allows you to use the attributes of the link entities in the fetch on your templates, if this is set to false than the Unique Identifier for the Linked Entity will not be automatically added which means you wont be able to use the attributes of the linked entity in your template.

However if you want to return distinct values with your fetchXML, the value of this attribute needs to be false.

Allow Adding Records

The Allow Adding Records checkbox allows users to add records to the CRM Entity that the widget is configured to use. When checked, you will be prompted to choose a page or a form from which the widget will use to add records.

Allow Editing Records

The Allow Editing Records checkbox allows users to edit existing records from the CRM Entity that the widget is configured to use. When checked, you will be prompted to choose a page or a form from which the record will be edited from.

Allow Deleting Records

The Allow Deleting Records checkbox allows users to delete existing records from the CRM Entity that the widget is configured to use.

Allow Exporting Records

The Allow Exporting Records checkbox allows you to export and download the entirety of a CRM Entity in spreadsheet (.xls) format. Please note that this spreadsheet will include all selected data fields as per the BuildXML even if they don't physically appear on the widget.

FetchXML

The FetchXML text area determines what sort of data a widget will be populated with. Clicking the Load Default Fetch option will populate the FetchXML area with a default fetch based on the CRM Entity chosen.  By clicking the Build button, we will be sent to another page in order to determine what the widget will look up. For more information on how to use the FetchXML function, please see the FetchXML Builder How-To.

SubGridSettings

SubGridSettings can be found under Advanced > Model > SubGridSettings.

Property

Description

AddExistingRecordsButtonClass

The CSS class of the Add Existing Records Button.

 

AddExistingRecordsButtonText

The text of the Add Existing Records Button.

 

AddExistingRecordsIconClass

The CSS class of the Add Existing Record Button Icon.

AddExistingRecordsImageClass

The CSS class of the Add Existing Record Button Image.

AddExistingRecordsPlaceholderText

Place holder text of the Add Existing Records text box.

 

AddExistingRecordsCancelButtonClass

The CSS class of the Add Existing Record Cancel Button.

AddExistingRecordsCancelButtonIconClass

The CSS class of the Existing Record Cancel Button Icon.

AddExistingRecordsCancelButtonImageClass

The CSS class of the Add Existing Record Cancel Button Image.

 

AddExistingRecordsCancelButtonText

The text of the Add Existing Record Cancel Button.

 

AddExistingRecordsFinishButtonClass

The CSS class of the Add Existing Record Finish Button.

 

AddExistingRecordsFinishIconClass

The CSS class of the Add Existing Record Finish Button Icon.

AddExistingRecordsFinishImageClass

The CSS class of the Add Existing Record Finish Button Image.

AddExistingRecordsFinishButtonText

The text of the Add Existing Record Finish Button.

ExpandExistingRecordsOnFocus

Expand existing records on focused when this property is enabled.

SelectExistingRecordOnTab

Select the existing record on tab when this property is enabled.

 

GridSettings

GridSettings can be found under Advanced > Model > GridSettings
 

Property

Description

AddRecordButtonClass

The CSS class of the Add Record Button.

AddRecordButtonText

The button text of the Add Record Button.

AddRecordIconClass

The CSS class of the Add Record Icon.

AddRecordImageClass

The class of the Add Recode Image.

 

DeleteRecordButtonClass

The CSS class of the Delete Record Button.

DeleteRecordButtonText

The button text of the Delete Record Button.

DeleteRecordColumnHeaderText

The column header text of the Delete Record Column Header.

DeleteRecordColumnWidth

The width of the Delete Record Colum.

DeleteRecordIconClass

The class of the Delete Record Icon.

DeleteRecordImageClass

The class of the Delete Record Image.

EditRecordButtonClass

The class of the Edit Record Button.

EditRecordButtonText

The text of the Edit Record Button.

EditRecordColumnHeaderText

The column header text of the Edit Record Column Header.

EditRecordColumnWidth

The width of the Edit Record Colum.

EditRecordIconClass

The CSS class of the Edit Record Icon.

EditRecordImageClass

The CSS class of the Edit Record Image.

ExcelExportAllPages

If set to true the grid will export all pages of data.

ExcelExportFileName

Specifies the file name of the exported Excel file.

ExcelExportFilterable

Enables or disables column filtering in the Excel file.

Filterable

If set to true the user can filter the data source using the grid filter menu.

GridHeight

The height of the grid. Numeric values are treated as pixels.

Groupable

If set to true the column will be groupable.

Pageable

If set to true the grid will display a pager.

PageableAllowRefresh

If set to true the pager will display the refresh button. Clicking the refresh button will refresh the grid.

PageableButtonCount

The maximum number of buttons displayed in the numeric pager. The pager will display ellipsis (...) if there are more pages than the specified number.

PageablePageSizes

The number of data items which will be displayed in the grid. Default values are 10,25,50,100, all.

PageSize

The number of data items per page. The property has no default value. That is why to use paging, make sure somepageSizevalue is set.

ReorderableColumns

If set to true the user could reorder the columns by dragging their header cells.

ResizableColumns

If set to true, users can resize columns by dragging the edges (resize handles) of their header cells.

Scrollable

If set to true the grid will display a scrollbar when the total row height (or width) exceeds the grid height (or width).

ServerFiltering

If set to true, the data source will leave the filtering implementation to the remote service.

ServerGrouping

If set to true, the data source will leave the grouping implementation to the remote service.

ServerPaging

If set to true, the data source will leave the data item paging implementation to the remote service.

ServerSorting

If set to true the data source will leave the grouping implementation to the remote service.

ShowColumnMenu

If set to true the grid will display the column menu when the user clicks the chevron icon in the column headers. The column menu allows the user to show and hide columns, filter and sort (if filtering and sorting are enabled).

Sortable

If set to true the user could sort the grid by clicking the column header cells.

VirtualScrolling

If set to true the grid will always display a single page of data. Scrolling would just change the data which is currently displayed.

GridEvents

GridEvents can be found under Advanced > Model > GridSettings > GridEvents

GridEvents Allows you to add events handlers to the Grid. This is a list of the different events available. You pass in a function name to handle the desired event. More documentation of the Kendo grid events can be found in here: https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events 

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. 

EncryptGuids

The EncryptGuids advanced properties determines whether Guids should be encrypted or not. By default this is set to true.

WindowWidth

The WindowWidth advanced property allows you to define a default height for any pop-up windows to use. By default this is set to 1024 pixels. Please note that if the Window Auto Size advanced property is set to true, this property will not apply.

WindowHeight

The WindowHeight advanced property allows you to define a default height for a pop-up window to adhere to. By default this is set to 640 pixels. Please note that if the Window Auto Size advanced property is set to true, this property will not apply.

API

clear()

Clears the value of the widget.

Returns

None

set_value()

Sets the value of the widget.

Returns

None

disable()

Disables the widget on the page.

Returns

None

get_type()

Returns the widget type.

Returns

String

enable()

Enables the widget on the page.

Returns

None

get_associateRecordButton()

Returns the associate record button associated with the widget.
This method is only visible if the 'Allow Adding Existing Records' option is enabled on the Sub-Grid View widget.

Returns

jQuery Object     

get_existingRecordsCombo()

Returns a Kendo ComboBox object associated with the widget.

This method is only visible if the 'Allow Adding Existing Records' option is enabled on the Sub-Grid widget.

Returns

Kendo Object: Kendo.ui.ComboBox

hide_existingData()

Hides the existing data panel from the widget.
In order for this method to be visible, the 'Allow Adding Existing Records' option must be enabled on the widget.

Returns

None

show_existingData()

Shows the existing data panel on the widget.
In order for this method to be visible, the 'Allow Adding Existing Records' option must be enabled on the widget.

Returns

None

toggle_existingData()

Toggles the appearance of the existing data panel.
In order for this method to be visible, the 'Allow Adding Existing Records' option must be enabled on the widget.

Returns

None

get_container()

Returns the container element for the widget.

Returns

jQuery Object

get_element()

Returns the element of the widget.

Returns

jQuery Object

get_grid()

Returns the Kendo Grid Object associated with the widget.     

Returns

Kendo Object: Kendo.ui.Grid

get_kendoWindow()

Returns the Kendo Window Object associated with the widget.

Returns

Kendo Object: Kendo.ui.Window

get_model()

Returns the model object of the widget, which contains a number of useful properties related to the widget.
In the case of the Sub-Grid View widget, these returned properties and their types are:

  • AddRecordPageUrl: String
  • AllowAddingExistingRecords: Boolean
  • AllowAddingRecords: Boolean
  • AllowDeletingRecords: Boolean
  • AllowEditingRecords: Boolean
  • AllowExportingRecords: Boolean
  • ControlDataId: String
  • CurrentRecordId: String
  • CurrentRecordLogicalName: String
  • EditRecordPageUrl: String
  • ExistingRecordsDisplayAttribute: String
  • ExistingRecordsValueAttribute: String
  • GridSettings: Object
    • AddRecordButtonText: String
    • ExcelExportAllPages: Boolean
    • ExcelExportFileName: String
    • ExcelExportFilterable: Boolean
    • Filterable: Boolean
    • Groupable: Boolean
    • PageSize: Integer
    • Pageable: Boolean
    • PageableAllowRefresh: Boolean
    • PageableButtonCount: Integer
    • PageablePageSizes: String
    • ReorderableColumns: Boolean
    • ResizableColumns: Boolean
    • ServerFiltering: Boolean
    • ServerGrouping: Boolean
    • ServerPaging: Boolean
    • ServerSorting: Boolean
    • ShowColumnMenu: Boolean
    • Sortable: Boolean
    • VirtualScrolling: Boolean
  • RecordsToShow: String
  • SubGridSettings: Object
    • AddExistingRecordsButtonText: String
    • AddExistingRecordsCancelButtonText: String
    • AddExistingRecordsPlaceholderText: String
    • ExpandExistingRecordsOnFocus: Boolean
    • SelectExistingRecordOnTab: Boolean

Returns

None

get_windowPlaceHolder()

Returns the modal window associated with the widget.

Returns

jQuery Object

hide()

Hides the widget from the form.

Returns

None

show()

Shows the widget on the form.

Returns

None

toggle()

Toggles the visibility of the widget.

Returns

None

Full API With Examples