function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
MaidyMaidy 

How do I reRender only changed records within a block?

Hi,

 

Our users would like for the VF page their using load instantaneously upon selecting an answer option for a record within their checklist.

 

I would highly appreciate if anyone can help me in this end as I am new to apex/visualforce development and have tried looking for answers through the discussion board but am still struggling to implement this performance improvement request.

 

Visualforce Page Code:

 

<apex:page StandardController="Checklist_Item__c" extensions="CollectChecklistItemsExtension" recordSetvar="ChecklistItems" sidebar="false">
    <apex:form > 
        <apex:pageBlock title="Edit Checklist Item Data" id="idPageBlock" mode="edit">
            <apex:pageMessages /> 
            
            <apex:pageBlockButtons >
                <apex:commandButton value="Save" action="{!save}"/>
                <apex:commandButton value="Cancel" action="{!cancel}"/>
            </apex:pageBlockButtons>
            
            <apex:pageBlockTable value="{!ChecklistItems}" var="c" id="idPageBlockTable">
    
                <apex:column value="{!c.Id}" rendered="false" />
                
                <apex:column value="{!c.Question_Category__c}" headerValue="Category" />                
                
                <apex:column value="{!c.Question__c}" /> 
                
                <apex:column headerValue="Answer">
                    <apex:outputPanel id="idAnswerOutputPanel" >
                        <apex:inputField value="{!c.Answer__c}">
                        <apex:actionSupport event="onchange" reRender="idPageBlock" immediate="true" status="idStatus"/>
                        </apex:inputField>
                        <apex:actionStatus startText="processing..." id="idStatus"/>
                    </apex:outputPanel>  
                </apex:column>

                <apex:column headerValue="Comment">
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Comments__c}" />
                </apex:column>

                <apex:column headerValue="Issue">
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Issue__c}" rendered="{!c.Answer__c == ''}"/>
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Issue__c}" rendered="{!c.Answer__c == 'Yes'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_NO_Issue__c}" rendered="{!c.Answer__c == 'No'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_A_Issue__c}" rendered="{!c.Answer__c == 'In-Part A'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_B_Issue__c}" rendered="{!c.Answer__c == 'In-Part B'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_C_Issue__c}" rendered="{!c.Answer__c == 'In-Part C'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Issue__c}" rendered="{!c.Answer__c == 'N/A'}" />                 
                </apex:column>    
                                
                <apex:column headerValue="Action">
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Action__c}" rendered="{!c.Answer__c == ''}" />               
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Action__c}" rendered="{!c.Answer__c == 'Yes'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_NO_Action__c}" rendered="{!c.Answer__c == 'No'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_A_Action__c}" rendered="{!c.Answer__c == 'In-Part A'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_B_Action__c}" rendered="{!c.Answer__c == 'In-Part B'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Default_In_Part_C_Action__c}" rendered="{!c.Answer__c == 'In-Part C'}" />
                    <apex:InputTextArea rows="10" cols="40" value="{!c.Action__c}" rendered="{!c.Answer__c == 'N/A'}" />
                </apex:column>

            </apex:pageBlockTable>
        </apex:pageBlock>
    </apex:form>
</apex:page>

Many thanks.

 

bob_buzzardbob_buzzard

It looks like you're heading in the right direction.  However, you have specified the immediate atrribute as true for the actionsupport.  This means that the page will be submitted without taking the user's changes into account, so their selection for c.answer will be discarded.  If you remove that I'd expect their selection to be taken into account when re-rendering.

 

 

mtanmtan

Hi Bob,

 

Thanks for the reply.

 

I have removed the immediate attribute as recommended but it didn't do much difference in terms of the loading time.

 

I tried to use apex:param hoping that it will be intelligent enough to know that I only wanted the modified record refreshed but had the same loading time results.

 

               <apex:column headerValue="Answer">
                    <apex:outputPanel id="idAnswerOutputPanel" >
                        <apex:inputField value="{!c.Answer__c}">
                        <!-- <apex:actionSupport event="onchange" reRender="idPageBlock" immediate="true" status="idStatus"/> -->
                        <apex:actionSupport event="onchange" reRender="idPageBlock" status="idStatus"/>
                        <apex:param name="RecordId" value="{!c.Id}"/>
                        </apex:inputField>
                        <apex:actionStatus startText="processing..." id="idStatus"/>
                    </apex:outputPanel>  
                </apex:column>

 Is there something else I can do to improve on the loading time?

 

Thanks very much.

SantoshiSantoshi

If you really want to minimize the processing time then using javascript can be one option, but in this case you will have to call javascript to show refreshed or new value on page and at the same time by calling action function you can pass the value to the class i.e on server. It would be really goof if you can tell the exact scenario you are working on and on rerender what kind of values are populated..

bob_buzzardbob_buzzard

The problem is that you have to hit the server, and that's likely to be the biggest lag.  Generally speaking the way to avoid that is to supply all the records that could possibly be chosen when the page is originally created, store these in javascript, and then update the page through javascript when the user changes their selection.  You are likely to encounter problems with page size using that technique though.