Open a custom Freedom UI page from a custom button on Opportunity edit page and pass the Opportunity record Id to the custom page
Hello,
I'm trying to implement a custom page that is opened by clicking a custom button on the opportunity edit page. In the custom page, I'm trying to retrieve the opportunity record id but it is null everytime. Here below you can find my current implementation.
In Opportunity edit page, i've implemented the following.
define("UsrOpportunities_FormPage_em4fpxb", /**SCHEMA_DEPS*/["@creatio-devkit/common"]/**SCHEMA_DEPS*/, function/**SCHEMA_ARGS*/(sdk)/**SCHEMA_ARGS*/ { return { viewConfigDiff: /**SCHEMA_VIEW_CONFIG_DIFF*/[ ... { "operation": "insert", "name": "BtnOpenPodManager", "values": { "type": "crt.Button", "caption": "#ResourceString(BtnOpenPodManager_caption)#", "color": "primary", "clickMode": "default", "clicked": { "request": "usr.OpenPodManager" }, "size": "large", "iconPosition": "only-text", "visible": true }, "parentName": "ActionButtonsContainer", "propertyName": "items", "index": 0 }, ... ]/**SCHEMA_VIEW_CONFIG_DIFF*/, ... handlers: /**SCHEMA_HANDLERS*/[ { request: "usr.OpenPodManager", handler: async (request, next) => { const handlerChain = sdk.HandlerChainService.instance; const oppId = request.$context?.Id; console.log("Opportunity Id:", oppId); // record id available await handlerChain.process({ type: 'crt.OpenPageRequest', schemaName: 'UsrOpportunityPodManagerPage', $context: request.$context, modelInitConfigs: [{defaultValues: [{OpportunityId: oppId}]}], // setting the record Id to pass it to the custom page scopes: [...request.scopes] }); return next?.handle(request); } } ]/**SCHEMA_HANDLERS*/, }; });
In Custom page, I've implemented the following:
define("UsrOpportunityPodManagerPage", [], function () { return { ... handlers: [ { request: "crt.HandleViewModelInitRequest", handler: async (request, next) => { const ctx = request.$context || {}; let opptyId = ctx.OpportunityId; // trying to read the opportunity record Id // Propagate ctx.OpportunityId = opptyId; const res = await next?.handle(request); console.log("[PodManager] OpportunityId:", opptyId); // the value is null everytime return res; } }, ... ], ... }; });
The issue is that in the crt.HandleViewModelInitRequest the value of ctx.OpportunityId is null.
What I'm doing wrong? How I can solve this issue?
Thanks,
Matteo
Like
Hi Matteo,
crt.OpenPageRequest in Freedom UI does not support page parameters. As a workaround you can implement this using the browser’s native BroadcastChannel API to pass values.
Here is an example:
Sender page handler
handlers: /**SCHEMA_HANDLERS*/[ { request: "usr.OpenPodManager", handler: async function (request, next) { const handlerChain = sdk.HandlerChainService.instance; const oppId = await request.$context.Id; // Wait for the receiver page to signal it's ready const bc = new BroadcastChannel("Ready"); bc.onmessage = (event) => { if (event.data?.type === "Ready") { // Send the value to the receiver page const sender = new BroadcastChannel("OpportunityId"); sender.postMessage({ type: "OpenReceiverPage", payload: { OpportunityId: oppId } }); sender.close(); bc.close(); } }; // Open the receiver page await handlerChain.process({ type: 'crt.OpenPageRequest', schemaName: 'UsrOpportunityPodManagerPage', $context: request.$context, scopes: [...request.scopes] }); return next?.handle(request); } } ]/**SCHEMA_HANDLERS*/
Receiver page handler
handlers: /**SCHEMA_HANDLERS*/[ { request: "usr.HandleViewModelInitRequest", handler: async function (request, next) { await next?.handle(request); // Notify the sender page that the receiver page is ready to receive data const readyChannel = new BroadcastChannel("Ready"); readyChannel.postMessage({ type: "Ready" }); readyChannel.close(); // Listen for the data from the receiver page const bc = new BroadcastChannel("OpportunityId"); bc.onmessage = (event) => { if (event.data?.type === "OpenReceiverPage") { const oppId = event.data.payload?.OpportunityId; } }; } } ]/**SCHEMA_HANDLERS*/