1

Question: How can I independently edit and save each row/record in a custom list-view?

Background: I'm displaying a list of custom object records using apex:repeat. I included input and output fields with the same value (field) in each row in order to allow toggling via the rendered attribute. So far, toggling affects all the records. I can't figure out how to make the toggle affect each row/record independently.

Markup

<apex:page standardController="Item__c" showHeader="false"   sidebar="false"  extensions="ST_ItemsList" recordSetVar="items" standardStylesheets="false">

    <div class="main-body">
    <apex:form >
            <table class="table table-hover" id="sorted-table">
                <thead>
                 <tr>
                     <th>Name</th>
                     <th>Type</th>
                     <th>Deferral</th>
                     <th>Inactive</th>
                     <th>Created by</th>
                     <th></th>
                 </tr>
                </thead>
                <tbody>
                    <apex:repeat value="{!items}" var="r">
                      <tr>
                        <td><apex:inputField rendered="{!inputMode}" value="{!r.Name}"/><apex:outputField rendered="{!outputMode}" value="{!r.Name}"/></td>
                        <td><apex:inputField rendered="{!inputMode}" value="{!r.Type__c}"/><apex:outputField rendered="{!outputMode}" value="{!r.Type__c}"/></td>
                        <td><apex:inputField rendered="{!inputMode}" value="{!r.Deferral__c}"/><apex:outputField rendered="{!outputMode}" value="{!r.Deferral__c}"/></td>
                        <td><apex:inputField rendered="{!inputMode}" value="{!r.Inactive__c}"/><apex:outputfield rendered="{!outputMode}" value="{!r.Inactive__c}"/></td>
                        <td>{!r.CreatedBy.Name}</td>
                        <td><apex:commandLink rendered="{!outputMode}" value="edit" action="{!enterInputMode}"/><apex:commandLink rendered="{!inputMode}" action="{!exitInputMode}" value="save"/> </td>
                      </tr>
                    </apex:repeat>
                </tbody>
            </table>
            </apex:form>
    </div>

    </apex:page>

Controller

public with sharing class ST_ItemsList {
    List<Item__c> items;
    public Boolean inputMode{get;set;}
    public Boolean outputMode{get;set;}

    public ST_ItemsList(ApexPages.StandardsetController controller) {
        this.items = (List<Item__c>)controller.getRecords();
        inputMode = false;
        outputMode = true;
    }

    public PageReference enterInputMode() {
        inputMode = true;
        outputMode = false;
        return null;
    }

    public PageReference exitInputMode() {
        inputMode = false;
        outputMode = true;
        update items;
        return null;
    }

 }
  • Create a wrapper class for display, which encapsulates the Item__c record, and add attributes for inputMode and outPutMode (or just mode with values read and edit) . Then switch rendered based in the individual mode – techtrekker Mar 20 '13 at 23:20
  • Thank you both for replying. Sorry, I haven't had time to implement this yet. I'll look at it in a few days and hopefully accept one of your replies as an answer. – geeljire Mar 26 '13 at 12:34
1

You can do this in one of a few ways. Using standard Visualforce ajax and rerender, and using Javascript remoting in a couple of different scenarios. To stay the most inline with standard Visualforce, you will need to do one key thing, which is create an Edit, Delete or Save button for each row of your items. This button would need to pass a paramater that is the Id of the item in the list that you wish to edit. Here is a good example:

<apex:commandLink value="Delete" onclick="if(!confirm('Are you sure you want to delete this contact role?')) return;" action="{!delConRole}" rerender="ContactRolePanel">
   <apex:param name="delid" value="{!ocr.Id}"/>
</apex:commandLink>

Here is a full example of this code in practice. The example in question is a Visualforce page that allows for the inline editing and deleting of Opportunity Contact Roles:

Controller: https://github.com/Groundwire/GWBase/blob/master/src/classes/GW_EXT_OppContactRolesList.cls

Visualforce Page: https://github.com/Groundwire/GWBase/blob/master/src/pages/OppContactRolesList.page

1

Converting my comment into an answer.

You're along the right lines, but you need a record level mode variable rather than a controller level one.

Create a wrapper class for display, which encapsulates the Item__c record, and add attributes for inputMode and outPutMode (or just mode with values read and edit) . Then switch rendered based on the individual mode value.

Class ItemWrapper{
Public Item__c { get; set; }
Public String mode { get; set; }
}

You would of course need to pass in the record is as an apex:param within your commandLink to pass in the recordId into your controller.

Come to think of it, you are attempting inline edit, in which case you can use the apex:inlineEditSupport tag which Visualforce natively supports. http://www.salesforce.com/us/developer/docs/workbook/Content/visualforce_6.htm

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.