6

reRender on actionFunction is not working. I've also tried placing the actionFunction on top. What's wrong with my code?

function doSearch() {
    searchServer(document.getElementById("accName").value);
}
<apex:outputPanel id="searchBar">
    <input type="search" class="slds-input slds-lookup__search-input defaultShadow" id="accName" onkeyup="doSearch();"/>
</apex:outputPanel>
<apex:outputPanel id="master">
    <apex:outputPanel id="displayTable">
        <apex:outputPanel id="participants" rendered="{!registrations.size>0}">
            <apex:pageBlock id="asdf">            
                <apex:pageBlockTable value="{!registrations}" var="registration" id="registrations">
                    <apex:column >
                        {!registration.Name}
                    </apex:column>
                    <apex:column >
                        {!registration.Name__c}
                    </apex:column>        
                    <apex:column >
                        <center>
                            <svg class="slds-input__icon slds-icon-text-default slds-icon--x-small" aria-hidden="true">
                                <apex:outputText rendered="{!hasAttendance[registration.id]}">
                                    <use xlink:href="{!URLFOR($Asset.SLDS, 'assets/icons/utility-sprite/svg/symbols.svg#check')}"></use>
                                </apex:outputText>
                            </svg>
                        </center>
                    </apex:column>  
                </apex:pageBlockTable>
            </apex:pageBlock>  
        </apex:outputPanel>
        <apex:outputPanel id="signaturePanel">
        </apex:outputPanel>
    </apex:outputPanel>
</apex:outputPanel>
<apex:form>
    <apex:actionFunction name="searchServer" action="{!runSearch}" reRender="displayTable">
    apex:param name="accName" assignTo="{!memName}" value="" />
    </apex:actionFunction>
</apex:form>

the debug logs show that I'm getting the correct records but its not updating the page.

Improve this question
7
  • Can you ensure registrations has value
    – Reshma
    Commented Mar 17, 2017 at 4:35
  • Yes, it does. And the controller method works correctly based on the debug logs
    – sforce
    Commented Mar 17, 2017 at 4:39
  • how about adding a <script>alert()</script> in the area which is being rerendered ? (just to see if it rerendering the html at all). If the html is being refreshed the alert will fire.
    – Avidev9
    Commented Mar 17, 2017 at 4:46
  • 3
    @sforce It's a standard limitation of <use> tag in SVG. You cannot render it
    – Rohit Mourya
    Commented Mar 17, 2017 at 4:53
  • 1
    @RohitMourya i didnt know about that. removed the <use> and it worked! thanks a lot!
    – sforce
    Commented Mar 17, 2017 at 4:58

3 Answers 3

Reset to default
6

You can absolutely rerender the <use>and <svg> tag by:

The xmlns= on the div containing the SVG is a MUST as if you try to rerender without it the page will simply stall. Important trick to remember for anytime you are re rendering a container containing an SLDS SVG

How to convert a Visualforce apex:pageMessages to be lightning style

for example:

<div id="err_wrapper"
             class="slds-notify slds-notify--alert slds-theme--{!alertType} slds-theme--alert-texture"
             role="alert">
            <h2>
                <div xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                    <svg aria-hidden="true"
                         class="slds-icon icon-text-email slds-icon--small slds-m-right--x-small">
                        <use xlink:href="{!URLFOR($Resource.SLDS, '/assets/icons/utility-sprite/svg/symbols.svg#' + if(alertType = 'success','check','ban'))}"></use>
                    </svg>
                    <span id="err_text"></span>
                </div>
            </h2>
        </div>

In this case I rerendered the err_wrapper

Improve this answer
0
2

Late to the party here, but I recently ran into this issue where slds SVGs were not displaying after a rerender on a Visualforce page.

I added docType="html-5.0" to the apex:page tag per this source and it worked like a charm.

Improve this answer
0

As per @rohitmourya comment

It's a standard limitation of tag in SVG. You cannot render it

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .