Ask the Expert - UI Controls, Events & WebSocket with Ashirwad Gupta

Join Ashirwad Gupta (@gupta4) in this Ask the Expert session (4th - 8th Nov) on UI Controls, Events & WebSocket.

Meet Ashirwad: Ashirwad is a Principal Software Engineer at Pegasystems and responsible for UI capabilities in the platform. Ashirwad has close to 8 years of experience, out of which 6 years are as a Front end developer. It is his passion and love to build great products.

Message from Ashirwad: Hi everyone! I'm glad and excited to share my learnings and knowledge on Pega Autogenerated controls, Pega events infrastructure and WebSocket that helps in building the modern applications front end and can transform business operations in a limited timeframe by providing numerous OOTB customizations in a low-code way. I’m looking forward to provide answers to all your queries around Controls, Events and WebSocket and its related functionality.

Ask the Expert Rules

  • Follow the Pega Support Community's Community Rules of Engagement
  • This is not a Live Chat - Ashirwad will reply to your questions over the course of the week (4th - 8th Nov)
  • Questions should be clearly and succinctly expressed
  • Questions should be of interest to many others in the audience
  • Have fun!

Group Tags


Keep up to date on this post and subscribe to comments

November 3, 2019 - 9:38pm

Why are screen layouts restricted for overriding only 1 leve l?

November 4, 2019 - 12:51am
Response to HarishKumarS0921

Thanks for your question, but I need few other info points from you to assist you better.
Which screen layout are you referring to ? Portal or work area screen layout ? And how exactly are you overriding it ?

November 4, 2019 - 2:29pm

Hi Ashirvad - As I understood, we can send wesocket messages by using the Publish-Notification method in an activity and consume them by using onload activity in a dynamic layout where we specify the notification channel and filter properties.

Is there any other javascript api or something in pega to consume or fetch the websocket messages because we may have a scenario where front end is not developed in pega.



November 5, 2019 - 4:39am
Response to AbikashKumarS

Hi Abhikash, 

Thanks for your question. Unfortunately you cannot use the Pega's websocket infra with your own Front end because the OOTB websocket infra is tightly coupled with the Pega's UI events infra which is used in processing the callback. Also the websocket notifications rely on subscription id which we stamp on the the html tags (like div etc.) during the generation of the components. This subscription id is obtained by calling a java api which again is tightly coupled to Pega OOTB and is not exposed for external use.  

November 5, 2019 - 3:23am

I have simiral question as @Abikash.

After publishin a page to a channel, a dynamic layout (which is subscrubed) will be notified that the channel has a message (on a dynamic layout's setting panel we can specify an action on that event).

But how can we get the data from this page? So far I was able to get insights only using js function and then calling a data transform from it:

and here's the function (with 4 properties I pass to a data transform AddNewJobToMigrationList):

Is there any better way (or ever - any OTHER way) to avoid js function call?

November 5, 2019 - 6:51am
Response to vaspoz

Hi vaspoz,

Thanks for your question. The page is published and is received as json. There might be some additional properties also present in the response that is sent to the client and in that case we would not have any clue as which property in json maps to what property in clipboard. So Currently we do not directly convert the json response to clipboard page and we leave it to the developers to define the mapping as you have done in the sample above. The way that you are doing it is the best way to accomplish this.

November 5, 2019 - 1:18pm

Hi Ashirwad,

I have a button on my UI. On click event I have configured two actions.

First action is Run Activity - It will fetch some data and perform some calculations.

Second action is Local Action - (Conditional - When Rule)

The issue here is second action is conditional and it is based on the first action. So my question is after executing the first action how I can refresh the DOM so that newly calculated property will be taken into consideration?

At the moment what happens is it is taking old value which was present while generating the DOM.


November 6, 2019 - 9:03am
Response to RakeshBurbure

Hi Rakesh,

Thanks for your question. 
For your use case if you have configured a when condition on an action, the when condition needs to be evaluated at the server. Based on the when condition results we decide whether to execute the action or not. Since this decision happens on the server, we need to reload the entire action set again. For your case, where you have an action whose execution depends on some property that is set in the first runActivity, you cannot depend on when condition to conditionally execute your other actions in the same action set. You can rather use otherProperty instead of when rule, which will take an expression as condition and its evaluation happens on client.

Thanks again.

November 6, 2019 - 2:47am

Hi Ashirwad,

Is it planned for the next release to have : 

- Notifications using browser notification API as an action from receiving a notification from pega websocket ?

- Service worker to receive websocket notifications event without pega opened ? Would be great to have a notification where I can click on it to open my case on Pega for example.

- also service workers could provide a way to have a nice loading screen while application is loading like we have now on all modern websites (gmail, outlook, ...)


November 7, 2019 - 6:09am
Response to Marc-AntoineN

Hi Marc,

Thanks for your question.

We do not have any immediate plans to use the browser notification apis or the other requirements that you have mentioned in your question. But we would like to know your specific use case to understand your scenario better.


November 8, 2019 - 8:23am
Response to gupta4


The notification apis from browser allows to notify user even if he is on another application. This could be used for urgent events, like incoming interaction from VIP client or something. to get his attention back into Pega.

Could also be used to display error or confirmation messaged, can replaced confirm form, giving user confirmation on his action without the need have a dedicated screen which he needs to close.

But this works only if user is connected to Pega. If user is not connected, today the only way to notify him an action is needed is an email. But automatic emails from systems users tend to put them in a specific folder and not really look at it. So if browser is connecter with service worker we can provide a notification to the user, as long as browser is started, but who is today in office without browser opened ?


November 6, 2019 - 10:44am

Hi - 

Pega recently announced major changes to the UI in 8.4.  My understanding is the underlying UI structure will be changed radically with Cosmos.  How will we upgrade to 8.4?  UI and connectors are the two areas I explain to my clients that will break during an upgrade and given that the entire UI foundation is changing how much of a chore will it be to upgrade from say 8.1 to 8.4?  Has anyone at Pega decided what the upgrade path will look like?

Also, any updates on what we can expect for UX functionality in 8.4.  




November 8, 2019 - 8:13am
Response to ToddM211

Thanks for your question.

When we say there is a change in UI with Cosmos in 8.4, the reference is to the Cosmos design system that supersedes the UI-Kit design system. There is going to be some effort involved in migration to the new Cosmos system. The level of effort depends on factors like number of case types, overridden rules in UIKit, skin formats that have been customized etc.  

November 6, 2019 - 3:35pm

Hey is there an easy way to limit the possible input for an autocomplete ui control to just the pagelist referenced as source?
I know there are manual options to validate this. But it would be nice to have this as an OOTB option on the control.

We are using Pega 8.2.1

November 7, 2019 - 6:02am
Response to AndreasHubenthal

Hi Andreas,

Thanks for your question.

The requirement that you have cannot be fulfilled by an Autocomplete because autocomplete design does not have a validation attached to it. And it would not be a good design to have autocomplete validate the inputs as it is meant for the user to enter any text with an additional auto-suggest. In the latest versions of pega we have already introduced a new control i.e. AnyPicker which has the auto-suggest feature and the user cannot pick anything outside the list source.


November 7, 2019 - 2:09pm

As part of the accessbility where to change in PEGA 8.3 with the tabindex== "-1" to tabindex="0" other than in HTML

Hello all,

As per our requirement, we need to change the tab index value from "-1" to "0". Where we need to add the Tab index in Section dynamic layout cell properties. Or we need to add the writing JS or CSS code menas. Where we need to call those code. Please help us.

Because of the negative tab index value, In our Pega it is skipping the tab.

Section need to add tab index is for : "pyCaseHeaderTitle "

thanks all.

November 8, 2019 - 1:41am
Response to Vamsi chukkapalli

Hi Vamsi,

Thanks for your question.

A cell acts as just a container to the enclosing control, and if the control is having any action then by default we make it focusable. Otherwise without action it does not make sense to have a focus on a div. I am not sure about your specific use case, but in case you have to still provide a tabindex on the cell div, you can write a script and using specific selectors for the cell markup inside your concerned section, you can manipulate the dom to have a tabindex attribute with a value that you desire. This script should be called after onload by providing it as an argument to pega.u.d.attachOnload function.

November 8, 2019 - 3:46am


Today for accessibility there is a ruleset WAI I think, but need to give specifically to users, but if we expose our website to internet, or even manage dynamically if users need that accessibility configuration ? like for the languages ruleset that dynamically load, if we can find something in the user agent that asks for a specific accessibility level and pega automatically loads it ?



November 8, 2019 - 6:47am
Response to Marc-AntoineN

Hi Marc,

Thanks for your question.

There is already an enhancement in pipeline, that removes the dependency on the PegaWAI ruleset and "Enable accessibility add-on" checkbox setting which will solve all those issues that you are talking about.

November 8, 2019 - 8:33am

Thank you for the great discussion! Please continue asking questions by creating new posts.

Thank you to our wonderful expert, Ashirwad @gupta4 for being great in answering all queries!

Lochana | Community Moderator | Pegasystems Inc.