Display related contacts of an Account using Visualforce page

Hi, In this scenario we have explained about how to display related contacts of an searched account name. here we used apex:actionstatus to display the status of an record while page loading, For this we have to use apex:facet along with actionstatus in visualforce.

Apex Controller

public with sharing class DisplayAccWithContact {
    public String accName {get;set;}

    List<Account> lstacc = new List<Account>();
    List<contact> lstcon = new List<contact>();
    public List<contact> getContacts() {
       lstcon.clear();
       accIds.clear();
       lstacc.clear();      
       lstacc=[select id,name from Account where name=:accName];
       for(Integer i=0;i<lstacc.size();i++)
       {
           accIds.add(lstacc[i].Id);
       }
       
        lstcon =[select id,name,Phone, email,accountId from contact where accountid in : accIds];
        //system.debug('### List of Contacts for Test is ###'+ lstcon);
        return lstcon;
    }
    
    set<string> accIds = new set<string>();
    public pagereference showContacts() {
       return null;        
    }
}

Vf Page

<apex:page sidebar="false" controller="DisplayAccWithContact">
    <apex:form >      
        <apex:outputText value="Enter Account Name:"></apex:outputText>
        <apex:inputtext value="{!accName}" />
        <apex:commandButton value="ShowContacts" action="{!showContacts}" rerender="out" status="mystatus"/><br/>
        
        <apex:actionstatus id="mystatus" starttext="please wait contacts are loading.......">
            <apex:facet name="stop">
                <apex:outputpanel id="out">
                    <apex:pageBlock >
                        <apex:pageBlockSection >
                            <apex:pageBlockTable value="{!Contacts}" var="c" rendered="{!accName !=null}">
                                <apex:column headerValue="Name">
                                    {!c.Name}
                                </apex:column>
                                <apex:column headerValue="Phone">
                                    {!c.Phone}
                                </apex:column>
                                <apex:column headerValue="Email">
                                    {!c.Email}
                                </apex:column>
                            </apex:pageBlockTable>
                        </apex:pageBlockSection>
                    </apex:pageBlock>
                </apex:outputpanel>
            </apex:facet>
        </apex:actionstatus>
    </apex:form>
</apex:page>

Output