No Status

Js Code in Engagement.

  • 13 August 2019
  • 4 replies
  • 217 views

Userlevel 3
Description: Added the Calendly code to the PX engagement and launched it. However, the calendar does not show up in the engagement. Can engagements handle embedded javascript? code I am adding:

<!-- Calendly inline widget begin -->

<div class="calendly-inline-widget" data-url="https://calendly.com/aaron-new-innov/30min" style="min-width:320px;height:630px;"></div>

<script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js"></script>

<!-- Calendly inline widget end —>

As per our understanding, the JS code would be stripped off. Can we take this issue as a valid use case and raise a enhancement request?

thanks,

Avinash.


4 replies

Userlevel 7
Badge
This is an interesting use case for sure and certainly something that could be considered for our PX roadmap. @ciarapeter @mickey

You can currently do simple Javascript within an Engagement, such as the following:

------------------------------

<div class="px-dialog-title" id="pxbody">

<h1 id="demo">Check out my new Engagement</h1>

<button "alert('works, SIMPLE.')">Show alert</button>

<br>

<p id="demo2">Keep your eyes here... to watch me disappear.</p>

<button "document.getElementById('demo2').style.display='none'" type="button">Click Me for some Magic!</button>

<button "document.getElementById('demo2').style.display=''" type="button">Reset</button>

<br>

<button "document.getElementById('demo').style.color = 'red'" type="button">Click Me for some more magic!</button>

<button "document.getElementById('demo').style.color = ''" type="button">Reset</button>

<br>

<button 'document.getElementById("demo").innerHTML = "Now, GET BACK TO WORK!!:)"' type="button">Last click, go ahead...</button>

<button 'document.getElementById("demo").innerHTML = "Check out my new Engagement"' type="button">Reset</button>

</div>

------------------------------

However, as you found out, you cannot place actual Javascript code/functions within the Engagement source as it will be stripped out when it is saved. This is likely for security purposes and to prevent unexpected errors.

You should also be able to reference Javascript that exists within the parent page context with buttons/links, which could provide some options.

Userlevel 7
Badge
Welcome to the Community @avinashthorthi !

When you have a chance, be sure to Follow the PX topic. This will help you stay up to date on the latest PX conversations and product tips from Community!



Userlevel 3
Hey James, will this *simple Javascript* not work in preview mode? I pasted it in just to see what you were doing here, and don't seem to see anything happening in preview on Chrome. (Though I do get buttons out of it!)

Userlevel 7
Badge
Hi Mike! @mikewohlwend

Thanks for being interested in this! :)

It does work for me in "Preview" mode. It even works in the Engagement "Editing" mode, but these buttons will actually change the source content, so be sure to click "reset" to put it back to the initial state before saving.

So, this it makes me wonder if the copy/paste process was successful, which happens sometimes from one application (website) to another (PX app).

Anyways, here is the code view screenshot within my test PX Engagement in case it will help with your testing process.



Good luck!

Link

Reply