You need to sign in to do that
Don't have an account?
Trisha Hinojosa
Collapse <apex:dataTable>
Hello,
I am using a data table within a card. I would like to be able to collapse the table without having to use javascipt, just like I can with page block sections.
Any Ideas?
E.g., page block section:
...
<apex:pageBlockSection id="pg1" collapsible="true" title="Matters" columns="1">
<apex:pageblockTable value="{!result4}" var="matt">
<apex:column headerValue="Matter Name">
<apex:outputLink value="/{!matt.Id}" target="_blank">{!matt.name}</apex:outputLink>
</apex:column>
...
E.g., data table. Begins after <!-- /Make Collapsible ???-->
...
<!-- MATTER TABLE -->
<!-- HEADER CARD WITH ONE ACTION AND DATA TABLE -->
<article class="slds-card">
<div class="slds-card__header slds-grid">
<header class="slds-media slds-media_center slds-has-flexi-truncate">
<div class="slds-media__figure">
<span class="slds-icon_container slds-icon-custom-custom90" title="Matters">
<svg class="slds-icon slds-icon_small" aria-hidden="true">
<use xlink:href="/assets/icons/custom-sprite/svg/symbols.svg#custom90"></use>
</svg>
<span class="slds-assistive-text">Matter</span>
</span>
</div>
<div class="slds-media__body">
<h2 class="slds-card__header-title">
<span class="slds-text-heading_small">Matters</span>
</h2>
</div>
<div class="slds-no-flex">
<apex:form >
<apex:commandButton styleClass="slds-button slds-button--brand slds-not-selected" value="Export To Excel" action="/apex/MatterFetch"/>
</apex:form>
</div>
</header>
</div>
<!-- / HEADER CARD-->
<div class="slds-card__body slds-card__body_inner"> bla bla bla.</div>
<div class="slds-card__body">
<!-- /Make Collapsible ???-->
<apex:dataTable value="{!result4}" var="matt" styleClass="slds-table slds-table_bordered slds-is-selected slds-has-flexi-truncate">
<apex:column headerValue="Matter Name">
<apex:outputLink value="/{!matt.Id}" target="_blank">{!matt.name}</apex:outputLink>
</apex:column>
...
I am using a data table within a card. I would like to be able to collapse the table without having to use javascipt, just like I can with page block sections.
Any Ideas?
E.g., page block section:
...
<apex:pageBlockSection id="pg1" collapsible="true" title="Matters" columns="1">
<apex:pageblockTable value="{!result4}" var="matt">
<apex:column headerValue="Matter Name">
<apex:outputLink value="/{!matt.Id}" target="_blank">{!matt.name}</apex:outputLink>
</apex:column>
...
E.g., data table. Begins after <!-- /Make Collapsible ???-->
...
<!-- MATTER TABLE -->
<!-- HEADER CARD WITH ONE ACTION AND DATA TABLE -->
<article class="slds-card">
<div class="slds-card__header slds-grid">
<header class="slds-media slds-media_center slds-has-flexi-truncate">
<div class="slds-media__figure">
<span class="slds-icon_container slds-icon-custom-custom90" title="Matters">
<svg class="slds-icon slds-icon_small" aria-hidden="true">
<use xlink:href="/assets/icons/custom-sprite/svg/symbols.svg#custom90"></use>
</svg>
<span class="slds-assistive-text">Matter</span>
</span>
</div>
<div class="slds-media__body">
<h2 class="slds-card__header-title">
<span class="slds-text-heading_small">Matters</span>
</h2>
</div>
<div class="slds-no-flex">
<apex:form >
<apex:commandButton styleClass="slds-button slds-button--brand slds-not-selected" value="Export To Excel" action="/apex/MatterFetch"/>
</apex:form>
</div>
</header>
</div>
<!-- / HEADER CARD-->
<div class="slds-card__body slds-card__body_inner"> bla bla bla.</div>
<div class="slds-card__body">
<!-- /Make Collapsible ???-->
<apex:dataTable value="{!result4}" var="matt" styleClass="slds-table slds-table_bordered slds-is-selected slds-has-flexi-truncate">
<apex:column headerValue="Matter Name">
<apex:outputLink value="/{!matt.Id}" target="_blank">{!matt.name}</apex:outputLink>
</apex:column>
...