1

MY VF page has a repeating pageblock which has an apex:detail panel and a pageblocktable in it. The table has a checkbox which is updated via a remoting call. I need the apex:detail panel to be rerendered if one of the checkboxes is ticked in the table. How do I do this?

My Javascript call to the remoting code:

    function updateDisplay(checkbox, id){

    var checked = checkbox.checked;
    CallCycleController.RemoteUpdateisSelected(id, checked, function(result, event){
        var foo = result;
    });

}

Then my VF page section:

       <apex:repeat value="{!CallCycleActivitiesEx}" var="activity">
            <apex:pageBlock >

                <apex:outputPanel id="detail">
                    <apex:detail subject="{!activity.CallCycleActivity.Id}" relatedList="false" inlineEdit="true" title="false"/>
                </apex:outputPanel>

                <apex:pageblockTable styleClass="cc_row" width="95%" rowClasses="odd,even" value="{!activity.CallCycleActivity.CallCycleActivityContacts__r}" var="contact">
                    <apex:column styleclass="cc_col5" headerValue="CRMGroup">
                        <apex:inputCheckbox title="{!contact.Id}" value="{!contact.IsSelected__c}" styleClass="checkContact"
                                            onclick="updateDisplay(this, '{!contact.Id}');" />{!contact.Contact__r.AccredoCRMGroup__c}
                    </apex:column>

                    <apex:column styleclass="cc_col8" headerValue="Contact Name">
                        <apex:outputLink value="{!URLFOR($Action.Contact.View, contact.Contact__r.Id)}" target="_blank">{!contact.Contact__r.Name}</apex:outputLink>
                    </apex:column>
                    <apex:column styleclass="cc_col5" headerValue="Phone Number" value="{!contact.Contact__r.Phone}"/>
                    <apex:column styleclass="cc_col8" headerValue="Mobile Phone" value="{!contact.Contact__r.MobilePhone}"/>

                </apex:pageblockTable>

            </apex:pageBlock>

        </apex:repeat>

And my Controller code for the remoting:

    @RemoteAction
public static void RemoteUpdateisSelected(string remId, boolean remisSelected){
    system.debug('## RemoteUpdateisSelected: ' + remId + ' ' + remisSelected);

    //Get the CCA Contact that is being changed        
    CallCycleActivityContact__c ccaC = [Select Id, isSelected__c, CallCycleActivity__c, Contact__c, CRM_group__c 
                                        From CallCycleActivityContact__c Where Id = :remId];
    system.debug('### ccaC: ' + ccaC);

    //Set the flag on the CCA Contact - will either set it to true or false
    ccaC.isSelected__c = remisSelected;
    upsert ccaC;

    UpdateMainContact(ccaC);

}

The UpdateMainContact call in the Controller makes changes to what is displayed in the apex:detail panel, hence my need to have this refreshed after the remoteaction.

2
  • Add an action function that rerenders it and call that function on success of the remote action
    – Eric
    Sep 28 '15 at 3:39
  • Eric, can you help with code? Where do I put the action function and how do I call it (sorry not so clued up with this) from ?
    – Irene
    Sep 28 '15 at 3:52
1

You could try this, although you may have to add an action to get it to rerender (do not recall if this is the case here or not, but if you do just create a method with an empty body and call it.):

<apex:pageblockTable styleClass="cc_row" width="95%" rowClasses="odd,even" value="{!activity.CallCycleActivity.CallCycleActivityContacts__r}" var="contact">
    <apex:actionFunction name="rerenderDetail" rerender="detail"/>
                    <apex:column styleclass="cc_col5" headerValue="CRMGroup">
                        <apex:inputCheckbox title="{!contact.Id}" value="{!contact.IsSelected__c}" styleClass="checkContact"
                                            onclick="updateDisplay(this, '{!contact.Id}');" />{!contact.Contact__r.AccredoCRMGroup__c}
                    </apex:column>

Then in your remote action javascript simply add:

CallCycleController.RemoteUpdateisSelected(id, checked, function(result, event){
        var foo = result;
        //Add in your result check for success and in the positive check put this
        rerenderDetail();
    });
3
  • I get this error: 'apex:actionFunction' may not be used within an iterable component. You can use 'apex:param' to define parameters for the function and pass iteration-specific values via the parameters.
    – Irene
    Sep 28 '15 at 3:59
  • Ok, then move it just below the form tag
    – Eric
    Sep 28 '15 at 4:00
  • Fantastic - thanks so much Eric! I moved it to just outside the repeating section to below the pageblock. Works perfectly :)
    – Irene
    Sep 28 '15 at 4:07

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.