Use a modal window to collect secure data (e.g. credit card, bank account, etc.); and trigger an API to pause the call recording when the model window is opened and trigger a similar API/Event when the modal window is submitted/closed.
With the modal window approach following are to be clarified.
1. Is that possible to trigger a modal window by a radio button click (onclick)? The assumption is that the pre-action and a post action of this modal window can be used to invoke an API that would pause and resume the call recording.
2. In the past there is option always you to close the Modal window first before returning the handle to the parent; with constellation – how to disable the last option? The reason is users shall not be allowed to click outside the modal window to close/exit.
3. Though, it may not be supported wanted to check is that possible or there any possibilities to disable/prevent the closing the modal window via “X” click? If not, in the event of “X” is being used to close the window to force an activity/event to be triggered (to invoke an API)?
Not sure what was the specific purpose of the thought of opening a modal on click/change of radio button options, but it’s not possible in constellation OOTB.
Alternatively, instead of having a radio button, you have an embedded table for which you can choose to add new entries (payment methods) to the list using a modal window powered by Action (flow action) option. This Action option is available from v25 of course.
So with that you can have multiple entries added for your list and also you will have pre and post processing feature as well as well. You can control the visibility of the modal close (X) icon in constellation.
You can have a validation on the main screen submission for user to enter at least one entry into the list.
May be you can add a bit more detail of your use case for us to suggest few more approaches.
The objective of providing a modal window here is to call a web service that stops call and screen recording while collecting sensitive data within the modal window. The user should be restricted from doing other things on the screen (for example, launch another case) while screen recording is stopped. The modal window would be ideal in this situation because we are able to call the web service to stop the call/screen recording prior to launching the service case and start it back on clicking “done” on the service case as a Flow action post action. However, clicking on “X” or clicking outside the modal window does not invoke the post action on the flow action and will not start call/screen recording again.
I am also a little bit unclear on use case. Would seek for simplification. Triggering modal on checkbox click is not something that is common in web interfaces.
If you pursue with implementation here is a starting point, actionable checkbox: storybook - Storybook
In addition to the embedded table, with modal actions. You could also look to have an Optional Action (and make it Promoted, so its a nice visible button on the case). This could then call pre/post processing where you add the new payment details - this can then be used inside the assignment after.
“Use a modal window to collect secure data (e.g. credit card, bank account, etc.); and trigger an API to pause the call recording when the model window is opened and trigger a similar API/Event when the modal window is submitted/closed.“
Are you working on an interaction or on a service case? On both cases you can use an optional action with preprocessing to stop the recording through an API call. You can also use a flow or even a small case type to capture the same details, here you are more free to add business logic before and after the tasks to capture the details.
With Constellation we want to establish a predictable, recognizable, performant, standardized, accessible and intuitive set of UX patterns. This means we don’t allow buttons or on-click modals to be triggered from everywhere. If you want to configure a user action? Then you have an optional action which you can promote: it becomes a button on a standardized area in the case view.
