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
geeljiregeeljire 

Conditionally render and save each row within apex:repeat?

Objective: Allow each record in a custom listview table to be edited and saved independently in place (in the table).

 

Tried so far: I set up each row to contain both an apex:inputText and apex:outputText tags in order to allow input/output toggle via the rendered attribute. So far, I can only render the entire table conditionally. I don't know how to make the toggle affect each row/record independently.

 

Two questions:

 

  1. How can I independently edit each record?
  2. How can I independently save each record?

 

Markup:

 

<apex:form><table>
...
<tbody>
    <apex:repeat value="{!items}" var="r">
      <tr>
        <td><apex:inputText rendered="{!inputMode}" value="{!r.sample1}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample1}"></apex:outputText></td>
        <td><apex:inputText rendered="{!inputMode}" value="{!r.sample2}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample2}"></apex:outputText></td>
        <td><apex:inputText rendered="{!inputMode}" value="{!r.sample3}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample3}"></apex:outputText></td>
        <td><apex:inputText rendered="{!inputMode}" value="{!r.sample4}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample4}"></apex:outputText></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>

 

Apex class:

 

public with sharing class editModeControl {
    public Boolean inputMode{get;set;}
    public Boolean outputMode{get;set;}
    
    public editModeControl(ApexPages.StandardSetController controller) {
        inputMode = false;
        outputMode = true;
    }

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

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

 

 Please note that I have no save method implemented.

Shiv ShankarShiv Shankar
What is Items, and please put full code of VF and Controller
geeljiregeeljire

Items is a list of custom object records. Here are the details:

 

Full markup:

 

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

<c:page_template >

    <div class="main-body">
<apex:form >
        <table class="table table-hover" id="sorted-table">
            <thead>
             <tr>
                 <th>Sample1</th>
                 <th>Sample2</th>
                 <th>Sample3</th>
                 <th>Sample4</th>
                 <th>Created by</th>
                 <th></th>
             </tr>
            </thead>
            <tbody>
                <apex:repeat value="{!items}" var="r">
                  <tr>
                    <td><apex:inputText rendered="{!inputMode}" value="{!r.sample1}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample1}"></apex:outputText></td>
                    <td><apex:inputText rendered="{!inputMode}" value="{!r.sample2}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample2}"></apex:outputText></td>
                    <td><apex:inputText rendered="{!inputMode}" value="{!r.sample3}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample3}"></apex:outputText></td>
                    <td><apex:inputText rendered="{!inputMode}" value="{!r.sample4}"></apex:inputText><apex:outputText rendered="{!outputMode}" value="{!r.sample4}"></apex:outputText></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>


</c:page_template>

</apex:page>

 

Extensions:

 

public with sharing class ST_ItemsList {
    List<ST_Item__c> items;
    
    public ST_ItemsList(ApexPages.StandardsetController controller) {
        this.items = (List<ST_Item__c>)controller.getRecords();
    }    
 }

 

public with sharing class editModeControl {
    public Boolean inputMode{get;set;}
    public Boolean outputMode{get;set;}
    
    public editModeControl(ApexPages.StandardSetController controller) {
        inputMode = false;
        outputMode = true;
    }

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

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

 

geeljiregeeljire

By the way, everything is open to change. If you think the custom listview can be presented in a way that will faciliate independent editing and saving of records, I would welcome your suggestions.