Visualforce page to compare two old record with newly cloned record and highlight changed values

Question

I need to create a visual force page to compare an old record with a newly cloned record.

For example:

Existing Fields.           Account (Old Record)       Account (new Record)
id                              1234456                    1234456
name                            Sample 1                   Sample 1
IsActive__c                     false                      true
contact                         Contact 1                  Contact 2

I have a controller which pulls all the field names dynamically and feeds it to VF page. But I need to know how to pass record values of fields, old values, and new record values using the same apex:repeat tag. Can anyone point me towards the right direction??

Thanks.

Update: I tried using wrapper class and seems like I'm half way through...However, It is only displaying the first column

Controller Code: 

    public List<Wrapper> WrapperList { get; set; } 

    WrapperList.add(new Wrapper(fieldapiname,currentacc,previousacc));



VF Code:

 <apex:repeat value="{!wrapperList}" var="key" id="theRepeatId">
    <tr>
     <td><apex:outputText value="{!key.fieldapiname}" id="theValue"/><br/></td>
     <td><apex:outputText value="{!key.currentacc}" id="theValue1"/><br/></td>
     <td><apex:outputText value="{!key.previousacc}" id="theValue2"/><br/></td>
   </tr>

Answer 1

You need to use wrapper class for that which will have old and new records properties. Below is an example:

public List<compareAccount> accounts{get;set;}
public void fetchOldNewAccounts() {
    accounts = new List<compareAccount>();
    for(Account acc: [SELECT Id, Name FROM Account]){ // query your accounts
        accounts.add(new compareAccount(acc, acc)); // add old and new accounts in 1st and 2nd parameters respectively
    }
}

public class compareAccount {
    public Account oldAccount{get;set;}
    public Account newAccount{get;set;}

    public compareAccount(Account oldAccount, Account newAccount) {
        this.oldAccount = oldAccount;
        this.newAccount = newAccount;
    }
}

Now in the page inside iteration of accounts,

acc.oldAccount.Name

will give you old account name and

acc.newAccount.Name

will give you new account name

--added based on comments--

key.currentacc[fieldapiname]

is dynamic way of referencing

Answer 2

You need to access the field names dynamically using the field name:

 <apex:repeat value="{!wrapperList}" var="key" id="theRepeatId">
    <tr>
     <td><apex:outputText value="{!key.fieldapiname}" id="theValue"/></td>
     <td><apex:outputField value="{!key.currentacc[key.fieldapiname]}" id="theValue1"/></td>
     <td><apex:outputField value="{!key.previousacc[key.fieldapiname]}" id="theValue2"/></td>
   </tr>
 </apex:repeat>

Note the change to apex:outputField; this will allow the value to be a String, Date, DateTime, Boolean, etc and render a reasonable value.