How to pass captured values from Pega Web mashup to Pega platform application ?

I am trying to pass the captured values from Pega Web mashup to Pega platform application. I am using “Data Instance First” design pattern. I am using “Display a page” action to capture the data in a web mashup. I want to validate the captured data in PEGA and then persist that data in the DB before creating a case.

I have gone through some of the articles but I am not sure which one is correct:

a) Use data-pega-event-onpagedata mashup attribute to call a function and then use the Javascript function doAction() using syntax pega.web.api.doAction([gadgetname],[action],[parameters])

b) Using syntax PegaA_params={Context:‘<%=AppContext%>’,ParamOne:‘<%=JavaObject1%>’,ParamTwo:“<%=JavaObject2>”}

c) Using syntax data-pega-action-param-parameters=‘{UserIdentifier:“xxxxx”,Password:“yyyy”,ID:“1”}’

I have also read that if using “Create a new case” action, I can copy the parameters (Option b above) into clipboard using pyDefault data transform that gets called at the time of case creation.

Questions:

  1. As I am using “Display a page” action, how can I retrieve the values captured in the web mashup into PEGA ?

  2. Can anyone please share a working mashup code snippet which meets my criteria?

Hi @KaushikGhosh

Using “data-pega-event-onpagedata” Mashup Attribute

The data-pega-event-onpagedata mashup attribute can be used to call a function when the page data is ready. Here’s a code snippet:

<div data-pega-event-onpagedata="validateAndPersistData">

    <!-- Your web mashup content here -->

</div>

<script>

    function validateAndPersistData() {

        // Get the captured data from the web mashup

        var capturedData = ...;

        // Validate the data and persist it to the DB

        pega.web.api.doAction("yourGadget", "validateAndPersist", [capturedData]);

    }

</script>

Using Parameters in "Create a New Case" Action

If you are using the "Create a New Case" action, you can set the parameters in the `PegaA_params` data transform. Here's a code snippet:

<!-- Create a New Case action -->

<py:action name="pyCreateCase" path="pyCreateCase">

    <py:param name="PegaA_params" value="{UserIdentifier:'xxxxx',Password:'yyyy',ID:'1'}" />

    ...

</py:action>

<!-- pyCreateCase data transform -->

<py:data name="pyCreateCase" type="Data Page">

    <py:annotation>

        <py:param name="PegaA_params" type="String">User parameters</py:param>

    </py:annotation>

    <py:assign name="pyResult">

        ... // Validate and persist the data here

    </py:assign>

</py:data>

 

Mashup Code Snippet

Here's a working mashup code snippet that satisfies your criteria:`

<mashup>

    <mashup-head>

        <script type="text/javascript" src="pega-api-client.js"></script>

    </mashup-head>

    <mashup-body>

        <div data-pega-event-onpagedata="validateAndPersistData">

            <!-- Your web mashup content here -->

        </div>

        <script>

            function validateAndPersistData() {

                // Get the captured data from the web mashup

                var capturedData = ...;

                // Validate the data and persist it to the DB

                pega.web.api.doAction("yourGadget", "validateAndPersist", [capturedData], function(result) {

                    if (result.status === "success") {

                        // Data validated and persisted successfully

                    } else {

                        // Validation or persistence failed

                    }

                });

            }

        </script>

    </mashup-body>

</mashup>

Hope it helps.

Thanks

Megha