Wrapper Class Example Using Visualforce Salesforce 3 - Apex Basic | Visualforce Basic - Salesforce Funda

User Case :- we have user case we need to display all account Information with primitive data types Boolean as isSelected variable as Checkbox, there if we click on the check box it will show the related Contact Details in the output section, and if contact is not present for the selected Accounts it will show the Message as "No Contact Available"  so we will use wrapper class in apex and try to get all the data to visualforce 

Apex Class :-

public class AccountWrapperClassController3 {
  // Wrapper List
    public List<AccountWrapper> accountWrapperList { get; set; }
    // Selected contacts list
    public List<Contact> selectedContacts { get; set; }

    // Constructor
    public AccountWrapperClassController3() {
        accountWrapperList = new List<AccountWrapper>();
        List<Account> accList = [SELECT Id, Name, Phone, Industry, Rating FROM Account];
        for (Account obj : accList) {
            AccountWrapper wrap = new AccountWrapper();
            wrap.accobj = obj;
            wrap.isSelected = false;
            accountWrapperList.add(wrap);
        }
       selectedContacts = new List<Contact>();
    }

    // Action method to retrieve related contacts
    public void getRelatedContacts() {
        selectedContacts = new List<Contact>();
        Set<Id> accids = new Set<Id>();
        for (AccountWrapper wrapper : accountWrapperList) {
            if (wrapper.isSelected) {
                //List<Contact> contacts = [SELECT Id, Name, Phone, Email FROM Contact WHERE AccountId = :wrapper.accobj.Id];
                //selectedContacts.addAll(contacts);
                accids.add(wrapper.accobj.Id);
            }
        }
        List<Contact> contacts = [SELECT Id, Name, Phone, Email FROM Contact WHERE AccountId In : accids];
        selectedContacts.addAll(contacts);
    }

    // Check if any account is selected
    public Boolean getHasSelectedAccounts() {
        for (AccountWrapper wrapper : accountWrapperList) {
            if (wrapper.isSelected) {
                return true;
            }
        }
        return false;
    }

    // Wrapper Class
    public class AccountWrapper {
        public Account accobj { get; set; }
        public Boolean isSelected { get; set; }

        // Constructor
        public AccountWrapper() {
            this.accobj = new Account();
            this.isSelected = false;
        }
    }
}

VisualForce Page :-

<apex:page controller="AccountWrapperClassController3" >
    <apex:form >
        <apex:pageBlock title="Display Account Details" tabStyle="Account">
            <apex:pageBlockTable value="{!accountWrapperList}"  var="objwrapper">
                <apex:column >
                    <apex:inputCheckbox value="{!objwrapper.isSelected}">
                        <apex:actionSupport event="onchange" rerender="contactDetails" action="{!getRelatedContacts}"/>
                    </apex:inputCheckbox>
                </apex:column>
                <apex:column value="{!objwrapper.accobj.Name}"/>
                <apex:column value="{!objwrapper.accobj.Phone}"/>
                <apex:column value="{!objwrapper.accobj.Industry}"/>
                <apex:column value="{!objwrapper.accobj.Rating}"/>
            </apex:pageBlockTable>
        </apex:pageBlock>

      <apex:outputPanel id="contactDetails">
    <apex:pageBlock title="Related Contacts" rendered="{!hasSelectedAccounts || selectedContacts.size > 0}">
        <apex:pageBlockTable value="{!selectedContacts}" var="contact">
            <apex:column value="{!contact.Name}"/>
            <apex:column value="{!contact.Phone}"/>
            <apex:column value="{!contact.Email}"/>
        </apex:pageBlockTable>
    </apex:pageBlock>
    <apex:outputPanel styleClass="noContactsMessage" rendered="{!hasSelectedAccounts && selectedContacts.size == 0}">
       No Record
    </apex:outputPanel>
</apex:outputPanel>
    </apex:form>
      <style>
        .noContactsMessage {
            text-align: center;
            font-size: 24px;
            margin-top: 50px;
        }
    </style>
</apex:page>

it will look like this :-

for no related contact for account

and when we have related contacts for account 

feature :-