This JavaScript function toggles the display state of the specified tags that have expanded and collapsed views.
expandCollapseDetails(div_id, expandAlt, collapseAlt, expandgif, collapsegif)
div_id - Required. Identifier of the object to expand or collapse.
expandAlt - Required. Tooltip to show for expanding a selection. This tooltip shows when the object is in a collapsed state.
collapseAlt - Required. Tooltip to show for collapsing a selection. Available when the object is an expanded state.
expandgif - Required. Image to show when the selection is in a collapsed state.
collapsegif - Required. Image to show when the selection is in an expanded state.
None.
This example shows how the expandCollapseDetails() function can be used in a table to hide some advanced information that the user can retrieve by selecting a special icon at line level. The example shows how payment collection details, such as credit card number, can be viewed by selecting the plus (+) icon. The example also shows div, which enables you to specify whether to hide or show information. By default, the div is hidden (display:none).
<tbody>
<yfc:loopXML
binding="xml:/Order/ChargeTransactionDetails/@ChargeTransactionDetail"
id="ChargeTransactionDetail">
<%request.setAttribute("ChargeTransactionDetail",
YFCElement)pageContext.getAttribute("ChargeTransactionDetail"));%>
<yfc:makeXMLInput name="InvoiceKey">
<yfc:makeXMLKey binding="xml:/GetOrderInvoiceDetails/@InvoiceKey"
value="xml:/ChargeTransactionDetail/@OrderInvoiceKey" />
</yfc:makeXMLInput>
<tr>
<td class="tablecolumn"
sortValue="<%=getDateValue("xml:ChargeTransactionDetail:/
ChargeTransactionDetail/@Createts")%>">
<yfc:getXMLValue
binding="xml:/ChargeTransactionDetail/@Createts"/>
</td>
<td class="tablecolumn">
<yfc:getXMLValue
binding="xml:/ChargeTransactionDetail/@ChargeType"/>
<% if
(equals("AUTHORIZATION",getValue("ChargeTransactionDetail",
"xml:/ChargeTransactionDetail/@ChargeType")) ||
equals("CHARGE",getValue("ChargeTransactionDetail",
"xml:/ChargeTransactionDetail/@ChargeType"))) {%>
<% String divToDisplay="yfsPaymentInfo_" +
ChargeTransactionDetailCounter; %>
<img onclick="expandCollapseDetails('<%=divToDisplay%>',
'<%=getI18N("Click_To_See_Payment_Info")%>',
'<%=getI18N("Click_To_Hide_Payment_Info")%>',
'<%=YFSUIBackendConsts.FOLDER_COLLAPSE%>',
'<%=YFSUIBackendConsts.FOLDER_EXPAND%>')" style="cursor:hand"
<%=getImageOptions(YFSUIBackendConsts.FOLDER,"Click_To_See_Payment_Info")%>/>
<div id=<%=divToDisplay%>
style="display:none;padding-top:5px">
<table width="100%" class="view">
<tr>
<td height="100%">
<jsp:include page="/om/Orderdetail/
order_detail_paymenttype_collections.jsp">
<jsp:param name="PrePathId"
value="ChargeTransactionDetail"/>
<jsp:param name="ShowAdditionalParams"
value="Y"/>
<jsp:param name="DecryptedCreditCardLink"
value="L02"/>
</jsp:include>
</td>
</tr>
</table>
</div>
<%}%>
</td>
<td class="numerictablecolumn"
sortValue="<%=getNumericValue("xml:ChargeTransactionDetail:/
ChargeTransactionDetail/@CreditAmount")%>">
<yfc:getXMLValue binding="xml:/ChargeTransactionDetail/
@CreditAmount"/>
</td>
</tr>
</yfc:loopXML>
</tbody>