<script custom-tag="" type="application/ld+json">{"@context":"https://schema.org","@type":"TechArticle","headline":"Functions defined in client script field of an UI Page no longer works if the UI page is called from an UI page type variable for a catalog item","image":"http://support.servicenow.com/29f1d2661baf6010cafa53d8624bcb43.iix","author":{"name":"ServiceNow Support","url":"http://support.servicenow.com/now"},"keywords":"ServiceNow, NowSupport public Knowledge Base articles, Known Error,KB0694027,","wordcount":"207","publisher":"ServiceNow","url":"https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0694027","datePublished":"2018-08-10","dateCreated":"2018-08-01","dateModified":"2024-04-07","description":"<h2>Functions defined in client script field of an UI Page no longer works if the UI page is called from an UI page type variable for a catalog item</h2><br/><div style=\"overflow-x:auto\"><h2>Descripti","articleBody":"<h2>Functions defined in client script field of an UI Page no longer works if the UI page is called from an UI page type variable for a catalog item</h2><br/><div style=\"overflow-x:auto\"><h2>Description</h2><div><p>A code (such as a function) that is defined in the client script part of an UI Page is not being invoked if the UI page itself is called from an UI page type variable in a catalog item/record producer.</p></div><h2>Steps to Reproduce</h2><div> <p></p><ol><li>\r\n<p>Create a UI page with the following values:</p>\r\n<p>HTML:</p>\r\n<pre><?xml version="1.0" encoding="utf-8" ?>\r\n <j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">\r\n <button onclick="myFunction()">Click me</button><br /></j:jelly></pre>\r\n<p>Client script:</p>\r\n<pre>function myFunction() {<br /> alert("Function triggered");\r\n }\r\n </pre>\r\n</li><li>\r\n<p>Open any catalog item and create a new variable for it with the following values:</p>\r\n<ul style=\"list-style-type: none;\"><li>Type: UI Page</li><li>UI page: the UI page created earlier</li></ul>\r\n</li><li>\r\n<p>Click the Try It button on this catalog item and click on the button that appears on the page.</p>\r\n<p>Note that instead of returning a pop-up alert message and a message appears in the browser console: "myFunction is not defined".</p>\r\n</li></ol>\r\n<p> </p></div><h2>Workaround</h2><div><p>Move the code from the client script field part into the HTML field part of the UI page.</p>\r\n<p>For example:</p>\r\n<p><strong>Original values:</strong></p>\r\n<p>HTML:</p>\r\n<pre><?xml version="1.0" encoding="utf-8" ?>\r\n<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">\r\n<button onclick="myFunction()">Click me</button>\r\n</j:jelly></pre>\r\n<p>Client script:</p>\r\n<pre>function myFunction() {\r\nalert("Function triggered");\r\n}</pre>\r\n<p><strong>Moved values:</strong></p>\r\n<p>HTML:</p>\r\n<pre><?xml version="1.0" encoding="utf-8" ?>\r\n<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">\r\n<button onclick="myFunction()">Click me</button></pre>\r\n<p>Client script:</p>\r\n<pre>function myFunction() {\r\nalert("Function triggered");\r\n}\r\n</script>\r\n</j:jelly></pre></div><div><br /><strong>Related Problem: PRB1296896</strong></div></div>"}</script>