Code changes require reloading
Ensure that you reload your mashup after you edit the mashup <div> code so that the changes take effect.
Condition
Changes to a loaded mashup <div> code are not reflected in the behavior of the mashup.
Cause
Changes to the mashup <div> code after the mashup is loaded have no effect because the mashup is already loaded. For example, the following script sets the attributes but does not reload the mashup:
<script src ='http://sample.pega.com/prweb?pyActivity=pzIncludeMashupScripts'></script>
<script>
function loadMashup(){
var mashupDiv = document.querySelector("[data-pega-gadgetname]");
mashupDiv.setAttribute("data-pega-action-param-parameters", '{"pzSkinName":"Myapplication", "param1":"value1"}');
pega.web.api.doAction("PegaGadget", "load"); // load the mashup gadget on-demand
}
</script>
<div data-pega-gadgetname ='PegaGadget'
data-pega-action ='createNewWork'
data-pega-action-param-classname ='OSWVMA-Myapplication-Work-Case85'
data-pega-action-param-flowname = 'pyStartCase'
data-pega-isdeferloaded ='true'
data-pega-applicationname ='Myapplication'
data-pega-threadname ='MashupThread'
data-pega-resizetype ='stretch'
data-pega-url ='http://sample.pega.com/prweb'
data-pega-action-param-parameters ='' ></div>
<button onclick="loadMashup()">Load Mashup</button>
Solution
Load the mashup again after editing the mashup <div> code so that the new attribute settings take effect. Edit the code before the window load event is triggered and before gadget registration.
For example: <script src ='http://sample.pega.com/prweb?pyActivity=pzIncludeMashupScripts'></script> <script> function loadMashup(){ pega.web.api.doAction("PegaGadget", "load"); // load the mashup gadget on-demand } </script> <div data-pega-gadgetname ='PegaGadget' data-pega-action ='createNewWork' data-pega-action-param-classname ='OSWVMA-Myapplication-Work-CamCase84' data-pega-action-param-flowname = 'pyStartCase' data-pega-isdeferloaded ='true' data-pega-applicationname ='Myapplication' data-pega-threadname ='MashupThread' data-pega-resizetype ='stretch' data-pega-url ='http://sample.pega.com/prweb' data-pega-action-param-parameters ='' ></div> <script> (function setParameters(){ var params = {}; params.UserIdentifier = "cherj"; params.Password = eval("btoa('sample')"); document.querySelector("div[data-pega-gadgetname='PegaGadget']").setAttribute("data-pega-action-param-parameters", JSON.stringify(params)=""); })(); </script> <button onclick="loadMashup()">Load Mashup</button>
Previous topic Troubleshooting mashup issues Next topic Mashup issues with cross-domain (X-Frame) communication