Action Bar Api

Provides methods for creating and updating action bars. These functions are available under the `convenienceApi.actionBar` namespace.

Properties

generate

A collection of functions that are capable of generating elements used by the action bar with preset defaults

generateDefault

A collection of functions that are capable of generating application-default parts of the action bar

isVisible : Boolean

Gets the value of the action bar 'isVisible' property

isVisible

Function to hide or show the action bar

defaultActions

A collection of functions that provide the ability to save the form and other options

Methods

createDefaultActionBar() ⇒ Promise

Initializes default action bar including buttons and layout selector

destroy() ⇒ Promise

Removes children on all available slots on the action bar

Properties Details

generate

A collection of functions that are capable of generating elements used by the action bar with preset defaults

generateDefault

A collection of functions that are capable of generating application-default parts of the action bar

• generateDefault
  • .actionButtons() ⇒ Array.<HTMLElement>
  • .actionButtonsForAddPopup(popupControlApi, objectTypeName) ⇒ Array.<HTMLElement>
  • .actionButtonsForPopup(popupControlApi) ⇒ Array.<HTMLElement>
  • .layoutDropdown() ⇒ HTMLElement
  • .objectPager(validateReviewQueue) ⇒ HTMLElement | null

generateDefault.actionButtons() ⇒ Array.<HTMLElement>

Generate appropriate action buttons for a given form view-model

Returns: Array.<HTMLElement> - list of action button elements
Example

// The following code sample adds default buttons to the right slot of the action bar:
eventHandlers[eventNames.CREATE_ACTION_BAR] = function() {
    const actionBar = convenienceApi.actionBar;
    const buttons = actionBar.generateDefault.actionButtons();

    actionBar.containersPromise.then(function(containers) {
        // optional, adds spacing between buttons
        containers.rootElement.className = "rwa-button-group";
        buttons.forEach(function(button) {
            containers.rightSlotElement.appendChild(button);
        });
    });
};

generateDefault.actionButtonsForAddPopup(popupControlApi, objectTypeName) ⇒ Array.<HTMLElement>

Generate appropriate action buttons for a given form view-model "New Object" popup.

Returns: Array.<HTMLElement> - List of action button elements.

Example

// The following code sample adds a list of action buttons to a pop-up window:
eventHandlers[eventNames.CREATE_ACTION_BAR] = function() {
    const actionBar = convenienceApi.actionBar;
    const formSettings = convenienceApi.formSettings;
    const buttons = actionBar.generateDefault.actionButtonsForAddPopup(
        popupControlApi,
        formSettings.ObjectTypeName
    );

    actionBar.containersPromise.then(function(containers) {
        containers.rootElement.className = "rwa-button-group";
        buttons.forEach(function(button) {
            containers.centerSlotElement.appendChild(button);
        });
    });
};

generateDefault.actionButtonsForPopup(popupControlApi) ⇒ Array.<HTMLElement>

Generate appropriate action buttons for a given form view-model popup.

Returns: Array.<HTMLElement> - List of action button elements.

Example

// The following code sample adds a default layout drop-down element to the right slot of the action bar:
eventHandlers[eventNames.CREATE_ACTION_BAR] = function() {
    const actionBar = convenienceApi.actionBar;
    const layoutDropdown = actionBar.generateDefault.layoutDropdown();

    actionBar.containersPromise.then(function(containers) {
        containers.rightSlotElement.appendChild(layoutDropdown);
    });
};

generateDefault.layoutDropdown() ⇒ HTMLElement

Generate a default layout dropdown element

Returns: HTMLElement - layout dropdown element
Example

// The following code sample adds a default layout drop-down element to the right slot of the action bar:
eventHandlers[eventNames.CREATE_ACTION_BAR] = function() {
    const actionBar = convenienceApi.actionBar;
    const layoutDropdown = actionBar.generateDefault.layoutDropdown();

    actionBar.containersPromise.then(function(containers) {
        containers.rightSlotElement.appendChild(layoutDropdown);
    });
};

generateDefault.objectPager(validateReviewQueue) ⇒ HTMLElement | null

Generate default pager element. Note that when a pager is returned, the page number and page count are already updated.

Returns: HTMLElement | null - pager element

Example

// The following code sample adds a pager to the right slot of the custom action bar:
function populateCustomActionBar(containers) {
    const actionBar = convenienceApi.actionBar;
    const pager = actionBar.generateDefault.objectPager();

    containers.rightSlotElement.appendChild(pager);
}

isVisible : Boolean

Gets the value of the action bar 'isVisible' property

isVisible

Function to hide or show the action bar

defaultActions

A collection of functions that provide the ability to save the form and other options

• defaultActions
  • .save() ⇒ Promise
  • .saveAndContinue() ⇒ Promise
  • .saveAndNew() ⇒ Promise
  • .saveAndBack() ⇒ Promise
  • .saveAndNext() ⇒ Promise
  • .saveAndPrevious() ⇒ Promise
  • .saveAndGo(requestedArtifactId) ⇒ Promise
  • .cancel() ⇒ Promise
  • .delete(completedDeleteCallback) ⇒ undefined
  • .edit() ⇒ Promise.<Boolean>
  • .back() ⇒ Promise

defaultActions.save() ⇒ Promise

Form save operation

Returns: Promise - Promise after save submission

defaultActions.saveAndContinue() ⇒ Promise

Form save operation

Returns: Promise - Promise after submission and its corresponding action.

defaultActions.saveAndNew() ⇒ Promise

Save the form and navigate to the add page for a given object type

Returns: Promise - Promise after save submission and its corresponding navigation

defaultActions.saveAndBack() ⇒ Promise

Form save operation

Returns: Promise - Promise after submission and its corresponding action.

defaultActions.saveAndNext() ⇒ Promise

Save the form and switch to the next object

Returns: Promise - Promise after save submission and its corresponding object switch action

defaultActions.saveAndPrevious() ⇒ Promise

Save the form and switch to the previous object

Returns: Promise - Promise after save submission and its corresponding object switch action

defaultActions.saveAndGo(requestedArtifactId) ⇒ Promise

Save the form and navigate to the given artifact id

Returns: Promise - Promise after save submission and its corresponding navigation

defaultActions.cancel() ⇒ Promise

Attempts to navigate back to the previously visited artifact, if any, otherwise navigates back to item list

Returns: Promise - Promise that resolves when onCancel finishes navigation or confirmation modal was cancelled

defaultActions.delete(completedDeleteCallback) ⇒ undefined

deletion handler function

defaultActions.edit() ⇒ Promise.<Boolean>

Redirect user to an edit page within the application.

Returns: Promise.<Boolean> - Promise that resolves to whether the navigation was successful.

defaultActions.back() ⇒ Promise

Navigates to the previous page. If the navigation was not successful, the URL is pushed back.

Returns: Promise - Returns a promise that indicates whether the navigation was successful.

createDefaultActionBar() ⇒ Promise

Initializes default action bar including buttons and layout selector

Returns: Promise - promise of initialized default action bar
Example

// The following code sample adds a single button to the center slot of the action bar:
eventHandlers[eventNames.CREATE_ACTION_BAR] = function() {
    convenienceApi.actionBar.createDefaultActionBar().then(function() {
        return convenienceApi.actionBar.containersPromise;
    }).then(function(containers) {
        const button = convenienceApi.actionBar.generate.button({
            innerText: "Say Hello",
            onclick: function() {
                alert("Hello!");
            }
        });
        containers.centerSlotElement.appendChild(button);
    });
}

destroy() ⇒ Promise

Removes children on all available slots on the action bar

Returns: Promise - promise of a destroyed action bar
Example

// The following code sample destroys the action bar when a specific artifact ID is encountered during the object switching process:
function populateCustomActionBar(containers) {
    const actionBar = convenienceApi.actionBar;
    const button = actionBar.generate.button({
        innerText: "Say Hello",
        onclick: function() {
            alert("Hello!");
        }
    });
    const pager = actionBar.generateDefault.objectPager();

    containers.centerSlotElement.appendChild(button);
    containers.rightSlotElement.appendChild(pager);
}

function populateDefaultActionBar() {
    convenienceApi.actionBar.createDefaultActionBar();
}

function createActionBar() {
    const actionBar = convenienceApi.actionBar;
    const formViewModel = this;
    // Change to an artifact ID of an instance of the
    // given object type that exists in your workspace.
    const ARTIFACT_ID_THAT_NEEDS_CUSTOM_ACTION_BAR = 1050081;

    return actionBar.destroy().then(function() {
        return actionBar.containersPromise;
    }).then(function(containers) {
        if (formViewModel.artifactId === ARTIFACT_ID_THAT_NEEDS_CUSTOM_ACTION_BAR) {
            populateCustomActionBar(containers);
        } else {
            populateDefaultActionBar();
        }
    });
}

const eventHandlers = {};
eventHandlers[eventNames.CREATE_ACTION_BAR] = createActionBar;
eventHandlers[eventNames.UPDATE_ACTION_BAR] = createActionBar;