2

I am trying to output a string that contains HTML, and some try to call a client-side server action. However, when inspecting the output code, the onclicks are not triggered.

Here is what I have so far:

Lightning component:

<aura:attribute name="article" type="API.Article" />
<ui:scrollerWrapper class="scrollerSize">
    <div class="slds-text-heading_medium article-title">{!v.article.title}</div>
    <div class="article-text">
        <aura:unescapedHtml value="{!v.article.content}"/>
    </div>
</ui:scrollerWrapper>

Output HTML copied from Chrome (I assume the onclick should have been processed)

<ul>
    <li>
        <span onclick="{! c.getArticle }">
            <a data-articleid="account-go-live" href="javascript:void(0);">
                Test internal link
            </a>
        </span>
    </li>
</ul>

Component controller

getArticle : function(component, event, helper) {
        console.log('hit');
        var searchText = component.get("v.searchText");
        var category = component.get("v.searchCategory");
        var currentArticle = component.get("v.article.id");
        var previousArticles = component.get("v.previousArticles");
        if(previousArticles == null)
            previousArticles = [];
        previousArticles.push(currentArticle);

        var action = component.getEvent("SearchToArticle");
        action.setParams({"articleId" : event.currentTarget.children[0].dataset.articleid, "searchText" : searchText, "searchCategory" : category, "previousArticles" : previousArticles});
        action.fire();
    }

Any idea how can I make the onclick="{! c.getArticle }" actually trigger an action?

  • 1
    Can you include the controller/relevant apex with your question? Or at least what the output of getArticle is. – battery.cord Nov 15 '17 at 16:40
  • 2
    You say in your title that you're trying to do a server-side action, but in your body you say it's a client-side action. Can you please edit your question so it is less ambiguous? – sfdcfox Nov 15 '17 at 16:42
  • @battery.cord Just added, but the problem is that the action is never triggered. – Joao Batista Nov 15 '17 at 16:55
  • @sfdcfox Thanks for the feedback! You are right, I have just updated the title – Joao Batista Nov 15 '17 at 17:05
  • You can't execute direct JavaScript that way. You're going to have to come up with a different way to do this. This is a bit of an x-y problem. Consider asking a question that directly asks about how to do what you're trying to do, instead of trying to go down a specific, probably non-viable solution path. – sfdcfox Nov 15 '17 at 18:03
0

Ok, the answer to your question: Salesforce doesn't translate the code which you put inside of dynamic params to aura:unescapedHtml tag.

Compare: if you put your code inline

<ui:scrollerWrapper class="scrollerSize">
    <ul><li> <span onclick="{! c.getArticle }"> <a data-articleid="account-go-live" href="javascript:void(0);"> 
        Test internal link </a>  </span> </li> </ul>
</ui:scrollerWrapper>

then Salesforce would translate it and add click listener enter image description here

If you put it as value of param to aura:unescapedHtml tag, it is no longer part of Lightning component markup, thus it is not processed by Salesforce: enter image description here

  • Thanks @patlatus! So is there any way to turn an HTML string into actual code that can be translated by Salesforce? – Joao Batista Nov 16 '17 at 9:55
  • no, why would you need that? – Patlatus Nov 16 '17 at 10:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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