-
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
Why Do You Need Salesforce CRM Support in 2024?
In the fast-paced world of business, nurturing strong relationships with customers is the cornerstone of success. That's where Customer Relationship Management (CRM) platforms like Salesforce…
How to use Amazon AppFlow to transfer data between Salesforce and AWS
Managing the flow of data between AWS and Software-as-a-Service SaaS applications like Salesforce can be difficult, time-consuming, and expensive. Developers can often spend months writing…
A Comprehensive Guide to Salesforce Lightning Development
Businesses are depending more and more on strong, adaptable platforms as the digital landscape changes in order to spur innovation and productivity. One such platform…
