I solved this problem by using urlencoding. Below is a working example. What I do here is, first I encoded the Case Subject in Condroller using EncodingUtil.URLENCODE
then again decode the value in VF page using decodeURI
. I have used two <apex:outputText
here, one is hidden and used to hold the encoded value and other used to display the characters in the page. Once the <apex:actionPoller
completes the action call I am calling another JS function stop
to decode the value and update the <apex:outputText
with the help of <apex:actionStatus
. Also on the page load, I am calling the JavaScript stop();
method to decode and render the character properly.
VF Page
<apex:page controller="exampleConEx">
<apex:form id="myform" >
<apex:actionStatus id="status" onstart="start()" onstop="stop()"/>
<apex:outputText value="Watch this counter: {!count}" id="counter"/><br/>
<apex:outputText value="{!emojiCase.Subject}" id="emoji"/><br/>
<apex:outputText value="{!emojiCase.Subject}" id="emojihidden" style="display:none;" />
<apex:actionPoller action="{!incrementCounter}" reRender="counter,emojihidden" interval="15" status="status" />
</apex:form>
<script type="text/javascript">
stop();
function start(){
//alert("Starting");
}
function stop(){
var casesub = document.getElementById('{!$Component.myform.emojihidden}').innerHTML;
document.getElementById('{!$Component.myform.emoji}').innerHTML = decodeURI(casesub);
}
</script>
</apex:page>
Controller
public class exampleConEx {
Integer count = 0;
Case emojiCase = null;
public PageReference incrementCounter() {
count++;
return null;
}
public Integer getCount() {
return count;
}
public Case getEmojiCase(){
emojiCase = [SELECT Id, Subject FROM CASE WHERE CaseNumber = '00001036'];
String str = emojiCase.Subject;
emojiCase.Subject = EncodingUtil.URLENCODE(str,'UTF-8');
return emojiCase;
}
}
On Page load

Issue after rerender happens as described by Sam C

Working example with URL Encoding (The case has been updated in the backend to add more characters)

1F479
and the inside symbol is a Japanese Goblin with the code1F47A
– user24634 Dec 15 '16 at 12:41