- Since:
- 5.1
Options
editable :boolean
Type:
- boolean
- Default Value:
- false
Example
function( options ) {
options.editable = true;
return options;
}
features :Object
Controls which general features of the Interactive Grid are enabled.
Note: This only deals with general features for the Interactive Grid, not features only specific to certain views. For specific view feature configuration, see the 'views' option object.
Type:
- Object
Properties:
Name | Type | Description |
---|---|---|
filter |
boolean | Controls if filtering is available for the Interactive Grid |
flashback |
boolean | Controls if flashback is available for the Interactive Grid |
- Default Value:
{ filter: true, flashback: true }
Example
function( options ) {
options.features.filter = false;
options.features.flashback = false;
return options;
}
initActions :function
Allows you to add or modify actions. function( actions )
Function has one argument 'actions', which is the Interactive Grid's action's interface object. Note: Within
the function, the actions.context property can be used to access the main interactiveGrid widget element
(the context for the actions).
Please see interactiveGrid#actions-section for a listing of all the predefined actions used by the Interactive Grid widget, and actions for further general information about actions.
Type:
- function
- Default Value:
- null
Example
function( options ) {
options.initActions = function( actions ) {
// Hide all elements associated with the show help dialog action
actions.hide( "show-help-dialog" );
// Add a keyboard shortcut to the show filter dialog action
actions.lookup( "show-filter-dialog" ).shortcut = "Ctrl+Alt+F";
actions.update( "show-filter-dialog" );
// Add new actions, either singularly passing in an actions object as shown here, or in
// multiple by passing an array of action objects
actions.add( {
name: "my-action",
label: "Hello",
action: function( event, focusElement ) {
alert( "Hello World!" );
}
} );
};
return options;
}
initialSelection :boolean
Controls if the Interactive Grid has an initial selection.
Note: This is only applicable where the current view supports selection, views that do not support selection will ignore this setting.
Type:
- boolean
- Default Value:
- true
Example
function( options ) {
options.initialSelection = false;
return options;
}
reportSettingsArea :boolean
Controls if the report settings area displays for the Interactive Grid. The report settings area shows information such as filters, control breaks and highlights applied to the current report. Pass false to hide the report settings area, however you should not rely on this being set to true to display report settings, it just needs to evaluate to truthy.
Note: For the case where report settings are displayed, this could change in the future to be an object, defining greater configurability (such as whether the controls are enabled, or if this should be collapsed by default), so please bear this in mind if using this option.
Type:
- boolean
- Default Value:
- true
Example
function( options ) {
options.reportSettingsArea = false;
return options;
}
toolbar :Object
Controls which functionality of the default Interactive Grid toolbar is displayed. If false or null, there will be no toolbar.
Note: To make further customizations to the toolbar including adding new buttons, please see interactiveGrid#toolbarData.
Type:
- Object
Properties:
Name | Type | Description |
---|---|---|
actionMenu |
boolean | Hide or show the actions menu. |
columnSelection |
boolean | Hide or show the column selection menu, to allow column-specific searches. Note: Ignored if toolbar.searchField is false. |
editing |
boolean | Hide or show the edit button. Note: This does not prevent the Interactive Grid from being edited, merely hides the button from the toolbar. If you wish to control whether the Interactive Grid can be edited at all, please see the interactiveGrid#editable option. |
reset |
boolean | Hide or show the reset button. |
save |
boolean | Hide or show the save button. |
savedReports |
boolean | Hide or show the select list showing any saved reports. |
searchField |
boolean | Hide or show the search controls (affects the column selection menu, search input field and go button). |
- Default Value:
{ actionMenu: true, columnSelection: true, editing: true, reset: true, save: true, savedReports: true, searchField: true }
Example
function( options ) {
options.toolbar.actionMenu = false;
options.toolbar.columnSelection = false;
return options;
}
toolbarData :Object
Contains the metadata for the toolbar displayed at the top of the Interactive Grid. If no value is provided, the toolbar defaults to the standard toolbar required in APEX.
To customize the default toolbar used by the Interactive Grid in APEX, typically you would start with a copy of the default toolbar metadata. Please see interactiveGrid#.copyDefaultToolbar for details on how to do this.
See toolbar widget for further details about what metadata is required.
Type:
- Object
- Default Value:
- Return value from interactiveGrid#.copyDefaultToolbar
Example
function( options ) {
var $ = apex.jQuery,
toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(), // Make a copy of the default toolbar
reportsGroupControls = toolbarData.toolbarFind( "reports" ).controls; // Locate the reports group
// Add new buttons after the default report controls. Note the toolbar is action driven, so
// we just need to define the correct action name with the button.
reportsGroupControls.push({
type: "BUTTON",
action: "save-report",
iconOnly: true
});
reportsGroupControls.push({
type: "BUTTON",
action: "show-save-report-as-dialog",
iconOnly: true
});
reportsGroupControls.push({
type: "BUTTON",
action: "show-edit-report-dialog",
iconOnly: true
});
reportsGroupControls.push({
type: "BUTTON",
action: "delete-report",
iconOnly: true
});
// Assign new toolbar data back to toolbarData configuration property
options.toolbarData = toolbarData;
// Return the options
return options;
}
Events
modechange
reportchange
reportchange
save
selectionchange
Triggered when the selection state changes and will work for all views that support selection (grid, icon, etc.).
Note: This event is also exposed declaratively through Dynamic Actions, see the 'Selection Change' event for Interactive Grid regions. If all you want to do is respond to this event and no other code, you may be able to use Dynamic Actions instead.
Properties:
Name | Type | Description | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
event |
event | jQuery event object. |
|||||||||
data |
Object | Additional data for the event.
Properties
|
Example
// Define in the 'Execute when Page Loads' page attribute
$( ".selector" ).on( "interactivegridselectionchange", function( event, data ) {
// add code to fire on selection change
} );
viewchange
Triggered when the view changes.
Note: This event is also exposed declaratively through Dynamic Actions, see the 'View Change' event for Interactive Grid regions. If all you want to do is respond to this event and no other code, you may be able to use Dynamic Actions instead.
Properties:
Name | Type | Description | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|
event |
event | jQuery event object. |
|||||||||
data |
Object | Additional data for the event.
Properties
|
Example
// Define in the 'Function and Global Variable Declaration' page attribute (not 'Execute when Page Loads'),
// in order to be active by the time the Interactive Grid is initialized.
$( ".selector" ).on( "interactivegridviewchange", function( event, data ) {
// add code to fire on view change
} );
viewmodelcreate
Methods
(static) copyDefaultToolbar() → {Array}
Returns a copy of the default Interactive Grid toolbar data structure. This is a copy of the array that will be used as the data option when the IG's toolbar is created. This is typically used from the Advanced JavaScript code function to customize the return value of this function and then assign to the toolbarData config property.
Note the array returned has an additional method toolbarFind( id ) that is used to locate a control group, control or menu item by id or action name. Unlike the find method of the toolbar widget this toolbarFind method works before the widget is created.
See toolbar widget for details.
The toolbar data structure returns a series of control groups for different parts of the toolbar. These control groups all have unique IDs, which can be used in conjunction with toolbarFind() to pinpoint the exact location in the toolbar that you wish to customize:
Control Group ID | Contents |
---|---|
search | All search controls (column search menu, search field and go button) |
reports | Saved report select list |
views | View selection pill buttons |
actions1 | Actions menu button |
actions2 | Edit and Save buttons |
actions3 | Add Row button |
actions4 | Reset report button |
Returns:
- Type
- Array
Example
function( options ) {
var $ = apex.jQuery,
toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(), // Make a copy of the default toolbar
actionsMenuGroup = toolbarData.toolbarFind( "actions1" ); // Locate the actions menu group
// Array position denotes displayed position in the toolbar, so let's add the new download button directly
// after the actions menu group in the array, such that it displays directly after the actions menu in the
// toolbar.
// Note: The toolbar is action-driven, so integrates easily with the Interactive Grid. To show the dialog, we
// just define the appropriate action for showing the download dialog (show-download-dialog).
actionsMenuGroup.controls.push( {
type: "BUTTON",
action: "show-download-dialog",
iconBeforeLabel: true
});
// Assign new toolbar data back to toolbarData configuration property
options.toolbarData = toolbarData;
// Return the options
return options;
}
focus()
getActions() → {apex.actions}
Returns:
- Type
- apex.actions
Example
apex.region("emp").widget().interactiveGrid("getActions").invoke("save");
getCurrentView() → {object}
Returns:
- Type
- object
getCurrentViewId() → {string}
Returns:
- Type
- string
getSelectedRecords() → {Array}
Returns:
- Type
- Array
getToolbar() → {jQuery}
Returns:
- Type
- jQuery
getViews(pViewIdopt) → {object}
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
pViewId |
string |
<optional> |
Id of the view to get. For example "grid" or "chart". |
Returns:
- Type
- object
gotoCell(pModelInstanceIdopt, pRecordId, pColumnopt)
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
pModelInstanceId |
String |
<optional> |
model instance id. only needed if using multiple models such as in master detail and the model has not already been set correctly by the master. |
pRecordId |
String | the record id of the row to go to. | |
pColumn |
String |
<optional> |
column in the record row to go to. |
refresh(pOptionsopt)
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
pOptions |
Object |
<optional> |
tbd/todo |
resize()
setSelectedRecords(pRecords, pFocusopt, pNoNotifyopt)
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
pRecords |
Array | an array of model records or an array of model record ids as returned by model getRecordId. If this is an empty array then the selection is cleared. | |
pFocus |
boolean |
<optional> |
if true the first cell of the selection is given focus |
pNoNotify |
boolean |
<optional> |
if true the selection change event will be suppressed |