osninc

Webviewer HTML+CSS+JQuery for Syntax Highlighting

Discussion created by osninc on Jun 25, 2017
Latest reply on Jun 27, 2017 by user19752

I am trying to learn the Webviewer based on Jeremy Brown's  Webviewer Integrations example files: Web Viewer Integrations Library - Soliant Consulting  I have created a new file with 5 text fields: HTML, CSS1, JS1, JQuery  and CODE that I am trying to combine with a calculation field and display in webviewer.  My goal is to be able to format the CODE and display it in the webviewer. I am using Prism which is a free code syntax highlighter that requires two files: prism.css and prism.js along with your own HTML file/field.  I have downloaded and opened these files in a text editor and then copied and pasted the files into the fields CSS and JQuery.  I then created a simple HTML file:

 

<!DOCTYPE html>

<html>

<head>

  PRISM

  <link href="**CSS1**" />

</head>

<body>

  PLACEHOLDER FOR CODE FIELD

<script src="**JS1**"></script>

</body>

</html>

 

What I get displayed in the webviewer is part of the CSS which is not what I was expecting, I would have expected "PALCEHOLDER FOR CODE FIELD as shown in the HTML.  I am also wondering how I can reference the CODE field once I get this working.  I want to be able to use this as a way to display readable XML or JSON when testing against a REST API.

Outcomes