What to do when SyntaxHighlighter doesnt work on Ajax loaded pages

Recently when working on a feature for syntax highligting using SyntaxHighlighter library, I noticed that pages loaded through Ajax was not higlighted. Here’s how I solved it.

The problem
Displaying syntax highlighted XML inside a JQuery Dialog widget in combination with Apache Tiles. The XML  should be loaded through a Ajax-call.

The solution
So, without going into futher details, you have to do two things in order to get this working:

  1. Include the SyntaxHighlighter libs in the main JSP / HTML-document
    <link href='styles/shCore.css' rel='stylesheet' type='text/css' />
    <link href='styles/shThemeDefault.css' rel='stylesheet' type='text/css' />
    <script src='scripts/shCore.js' type='text/javascript'></script>
    <script src='scripts/shBrushXml.js' type='text/javascript'></script>
    
    <script type="text/javascript">
    SyntaxHighlighter.all();
    </script>
    
  2. Call the ‘hightlight’ function in your JSP or Tile that views a JQuery Dialog widget or something similar
    <script type="text/javascript">
     SyntaxHighlighter.highlight();
    </script>
    
This entry was posted in Java, Web and tagged , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>