-
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.
- [adinserter block='9']
-
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
DML Statements vs Database Methods in Salesforce
DML stands for Data Manipulation language and it is used to create and modify records in Salesforce. It provides a way to manage records by…
Safeguarding Data and User Access in Salesforce Experience Cloud Sites
One of the remarkable features of Salesforce is its versatile, multi-layered sharing system that lets you assign different data sets to different sets of users.…
How Salesforce Boosted the Reach of MrBeast’s $1M Puzzle
Salesforce partnered with YouTuber MrBeast for a groundbreaking Super Bowl campaign that turned a traditional ad into an interactive $1 million puzzle hunt, massively amplifying…
