Tell me more ×
Salesforce Stack Exchange is a question and answer site for Salesforce administrators, implementation experts, developers and anybody in-between. It's 100% free, no registration required.

I wrote a little @RemoteAction method that returns a string. And the string is nothing but an HTML snippet that I want inserted on my page.

Callback method on the page receives the result and uses jquery .html(result) to stick it in the right place.

Problem: it's appending the string as a string, surrounded by double quotes so that all my tags are showing up on the page.

I think the problem is that the HTML string contains double-quotes (for things like IDs, data-role, classes). I think this because jquery will work if I hardcode in the string but surround it by single quotes in the .html().

Can I: Have sf return a string surrounded by single instead of double quotes? Have some sort of escaping or method to fix the string before calling .html()?

If so, how?

Controller:

@RemoteAction
global static string getRewardsText(id therateid){
    ControllerForCustomerRewardsView CFCRV=new ControllerForCustomerRewardsView();
    CFCRV.therateid = therateid;
    list<rewards__c> rewardlist = CFCRV.getTheRewards();
    string output = '<div data-role=\"collapsible-set\">';
    for (rewards__c r:rewardlist){
        output=output+'<div data-role=\"collapsible\">'; //open the collapsible
        if (!r.Program__c){ //if it's not a program                
            if (!r.Choice__c){//if it's included
                output=output
                    + '<h3>Included:' + r.Name + '</h3>' //collapsible section header
                    + '<p>'+r.Reward_Description__c+'</p>'; //content for that reward                        
                }
            else{
                    output=output
                    + '<h3>Choice:' + r.Name + '</h3>' //collapsible section header
                    + '<p>'+r.Reward_Description__c+'</p>'; //content for that reward
            }//if it's a choice


       output=output+'</div>'; //close the collapsible section
    }
    output=output+'</div>';  //wrapup the big list div

    return output;
}


JS on page, wrapped inside a function called by an onclick event:
MobileShop.getRewardsText(requestedrateid, function(result, event){                    
                if (event.status){ 
                    $j("#rewards").html(result);
                }
});

naked html tags

share|improve this question
Before returning the result, in the controller replace all double quotes with escape characters. So from " to \" and see how you go. – e-bacho 2.0 Aug 22 '12 at 5:27
yourHtmlStringVariable = yourHtmlStringVariable.replace('"', '\\"'); – e-bacho 2.0 Aug 22 '12 at 5:34
2  
How bout paste the code here, so we can see? – Saariko Aug 22 '12 at 8:49
1  
Saariko made me learn how to do the code formatting trick. Helpful? – Shane McLaughlin Aug 22 '12 at 14:34
I tried result.replace('"', '\\"'); No difference. Also tried using both \\" and \" in the controller method...no luck, but interestingly, both show back up as \" in the output. – Shane McLaughlin Aug 22 '12 at 14:38
show 1 more comment

2 Answers

up vote 4 down vote accepted

I just tried this and the problem seems to be that that Visualforce is escaping < and > as the HTML entities &lt; and &gt;. You can use jQuery to do the decoding for you (credit to Chris Fulstow):

  function htmlDecode(value){ 
    return $j('<div/>').html(value).text(); 
  }

Then

MobileShop.getRewardsText(requestedrateid, function(result, event){                    
    if (event.status){ 
        $j("#rewards").html(htmlDecode(result));
    }
});
share|improve this answer
Thanks, Pat! That was the trick. Would recommend adding that to the javascript remoting documentation since I could see a lot of use for this. – Shane McLaughlin Aug 24 '12 at 13:16
1  
Hi @ShaneMcLaughlin - although that jQuery one-liner fixes the problem at hand, I think Avidev9 is correct in his answer - rendering HTML in the controller violates the MVC pattern. A better architecture would be to emit JSON from the controller and render that in the page using jQuery Templates or some other mechanism. – metadaddy Aug 24 '12 at 20:56

Why are you constructing the html inside the controller?

You can just use the jquery template instead.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.