-
How we can make a button of expand and collapse in Salesforce?
we have to display a list of type
Account[+]
Contact[+]
If we click on + sign then all Account or Contact display and a [-] sign appear on Account i.e. Account[-] If we click [-] sign
then all Contact or Account are collapse as initially
-
4 Replies
-
Hi Shubham,
public class AccountPlusContact
{
public String plus{get;set;}
public List<Account> accList{get;set;}
public List<Contact> conList{get;set;}
public Integer i;
public AccountPlusContact()
{
i = 0;
plus = '[+]';
accList = new List<Account>();
conList = new List<Contact>();
}
public void accountShow()
{
if(i == 0)
{
accList = [SELECT Name FROM Account LIMIT 100];
plus = '[-]';
i = 1;
}
else
{
plus = '[+]';
accList = null;
i = 0;
}
}
}You can similarly write for contacts.
Hope this helps.
-
Thanks Shariq
Please give Vf Page
-
Hi Shubham,
Apex Page:-
<apex:page controller ="AccountPlusContact">
<apex:form>
<apex:pageBlock>
<h1>
Account
</h1>
<apex:commandLink value = "{!plus}" action ="{!accountShow}"/>
<apex:pageBlockTable value="{!accList}" var="acc" columns="3">
<apex:column value="{!acc.Name}"/>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page> -
<apex:page id="pgId" controller="SupportController" tabStyle="support__tab">
<!-- Stylesheet for support page section theme-->
<apex:stylesheet value="{!URLFOR($Resource.SupportStyles)}"/><apex:form id="fmId">
<apex:pageMessages /><div><a href="#" onclick= "expandAll();"><h1>Expand All</h1></a> / <a href="#" onclick= "collapseAll();"><b>Collapse All</b></a></div>
<br/>
<apex:pageBlock id="pBlock" >
<apex:pageBlockSection collapsible="true" rendered="false"/>
<apex:repeat value="{!SupportPageSectionList}" var="supPgSecVar">
<apex:pageBlockSection id="sec1">
<div id='sec1' > [<a >Show/Hide</a>] <b>{!supPgSecVar.Section_Name__c}</b></div>
<div id='sectn1' class= "section1" style="display:none;" >
<table>
<tr>
<td align='left' valign='top' width="1000">
<apex:stylesheet value="clear:both;"/>
<apex:outputText value="{!supPgSecVar.Section_Body__c}" escape="false"/>
</td>
</tr>
</table>
</div>
</apex:pageBlockSection>
<br/>
</apex:repeat>
</apex:pageBlock><script type='text/javascript'>
function expandAll(){
$(".section1").slideDown('fadeOut');}
function collapseAll(){
$(".section1").slideUp('slow');}
$(document).ready(function(){
$("#sec1").click(function(){
$(".section1").slideToggle("slow");
});
});
</script>
</apex:form>
</apex:page>Thanks
Log In to reply.
Popular Salesforce Blogs
Search Account Record Using Salesforce Flows | Learn Here
Go to Setup, enter flow in Quick Find then select Flows. Click on New Flow. From the template, select Screen Flow. If you are using…
How to Simplify Ideas Management in Salesforce
It goes without saying that having a system in place for collecting and evaluating recommendations for your strategic goals is a good idea. And gathering,…
Salesforce Interview Questions: Crack Any Salesforce Interview
To make sure you gain a detailed understanding of the types of questions you can expect during your job interview. We'll start by covering the…
