The Problem with Apostrophes in Hyperlinks

Today, I ran into a small problem with a link on a Visualforce page I had created. I had a Visualforce component with a table of account records. Some of the account record links worked perfectly, while others would not. I discovered the problem was with accounts with an apostrophe (‘) in their name. For example: McDonald’s or O’Kelly.

I’m sure there are guys out there who can explain the reason these apostrophes are problematic; I’m not that guy. I can just share what I found to resolve the problem. The solution is in the use of the JSENCODE( ).

JSENCODE( )? Why were you using javascript on links to begin with? Well, that is an issue for another post, but basically this page had to work within the Service Console. The Service Cloud Console has some crazy nuances that force you to do some things a bit differently. For more details, see my post titled, “Service Cloud Console Hyperlinks.”

The JSENCODE( ) function adds an escape character (ie: ‘/’ ) in front of the apostrophe so your account name will look more like: McDonald/’s or O/’Kelly.

So here’s a code snippet of how it would look. The openTab is the javascript call that processes the hyperlink.

</p>
<p>&amp;lt;apex:column headerValue="Account" style="width:400px"&amp;gt;<br />&amp;lt;a href="#" onClick="openTab('{!sl.AccountId}','{!JSENCODE(sl.Account__r.Name)}'); return false"&amp;gt;{!sl.Account__r.Name}&amp;lt;/a&amp;gt;<br />&amp;lt;/apex:column&amp;gt;<br />

Hope this helps you if you run into a similar problem. Be sure to share your insights and wisdom by commenting below.