---
schema_version: "1"
id: d57421728ff15fd4631699cb06116ecb761b6dcc2c036369bae9c3a51d5c9856
title: UI Update Based on Data Changes
collection: legacydeveloper
version: current
locale: en-us
portal_url: https://docs.salesforce.com/legacydeveloper/current/en-us/integration_patterns_and_practices/integ_pat_ui_updates_from_data_changes.md
canonical_url: https://developer.salesforce.com/docs/atlas.en-us.integration_patterns_and_practices.meta/integration_patterns_and_practices/integ_pat_ui_updates_from_data_changes.htm
source_site: developer.salesforce.com
content_type: documentation
content_hash: c555cb4cfb4f98142985e0edbc039caaa9845a256d59c2fb2f40783a41c6caa9
---
# UI Update Based on Data Changes

## Context

You use Salesforce to manage customer cases. A customer service rep is on the phone with a customer working on a case. The customer makes a payment, and the customer service rep needs to see a real-time update in Salesforce from the payment processing application, indicating that the customer has successfully paid the order’s outstanding amount.

## Problem

When an event occurs in Salesforce, how can the user be notified in the Salesforce user interface without having to refresh their screen and potentially losing work?

## Forces

There are various forces to consider when applying solutions based on this pattern:

- Does the data being acted on need to be stored in Salesforce?
- Can a custom user interface layer be built for viewing this data?
- Will the user have access for invoking the custom user interface?

## Solution

The recommended solution to this integration problem is to use the Salesforce Streaming API. This solution is composed of the following components:

- A PushTopic with a query definition that allows you to:
    - Specify what events trigger an update
    - Select what data to include in the notification
- A JavaScript-based implementation of the [Bayeux](https://docs.cometd.org/current4/reference/#_bayeux "HTML (New Window)") protocol (currently [CometD](https://docs.cometd.org/ "HTML (New Window)")) that can be used by the user interface
- A Visualforce page or Lightning component
- A JavaScript library included as a static resource

## Sketch

The following diagram illustrates how Streaming API can be implemented to stream notifications to the Salesforce user interface. These notifications are triggered by record changes in Salesforce.

UI Update in Salesforce Triggered by a Data Change ![UI Update Based on Data Changes Pattern](https://developer.salesforce.com/docs/atlas.en-us.integration_patterns_and_practices.meta/integration_patterns_and_practices/integration_patterns/images/ui_updates_data_changes.png)

## Results

**Benefits**

The application of the solution related to this pattern has the following benefits:

- Eliminates the need for writing custom polling mechanisms
- Eliminates the need for a user-initiated feedback loop

**Unsupported Requirements**

The solution has the following limitations:

- Delivery of notifications isn’t guaranteed.
- Order of notifications isn’t guaranteed.
- Notifications aren’t generated from record changes made by Bulk API.

**Security Considerations**

Standard Salesforce org-level security is adhered to. It’s recommended that you use the HTTPS protocol to connect to Streaming API. See [Security Considerations](https://developer.salesforce.com/docs/atlas.en-us.integration_patterns_and_practices.meta/integration_patterns_and_practices/integ_pat_security_considerations.htm "To be effective members of the enterprise portfolio, all applications must be created and integrated with relevant security mechanisms. Modern IT strategies employ a combination of on-premises and cloud-based services.").

## Sidebars

The optimal solution involves creating a custom user interface in Salesforce. It’s imperative that you account for an appropriate user interface container that can be used for rendering the custom user interface. Supported browsers are listed in the [Streaming API Developer Guide](https://developer.salesforce.com/docs/atlas.en-us.api_streaming.meta/api_streaming/intro_stream.htm "HTML (New Window)").

## Example

A telecommunications company uses Salesforce to manage customer cases. The customer service managers want to be notified when a case is successfully closed by one of their customer service reps.

Implementing the solution prescribed by this pattern, the customer should:

- Create a PushTopic that sends a notification when a case is saved with a Status of “Closed” and Resolution of “Successful.”
- Create a custom user interface available to customer service managers. This user interface subscribes to the PushTopic channel.
- Implement logic in the custom user interface that shows alerts generated by that manager’s customer service reps.