In a xe:dataView how to code the summary facet to show/hide the detail facet?

Question

By default the summary column adds a link to open the underlying document as specified in the dataView's pageName property. I have a use-case where I want to keep the application in the dataView, and not open any "documentXPage".

I know this could be done in a repeat, but there are other parts/functionality of the dataView that work nicely for the application, so ideally I'm just looking to override the default behavior of the summaryColumn.

To override the link behavior I added the summary column as a facet, instead of a property, as in:

<xp:this.facets>
    <xp:panel xp:key="summary" id="summaryPanel">
        <xp:text escape="false" id="computedField3">
            <xp:this.value><![CDATA[#{javascript:
var custName = viewEntry.getColumnValue("Customer");
return "<h4>"+custName+"</h4>"}]]>
                   </xp:this.value>
        </xp:text>
    </xp:panel>
    <xp:panel xp:key="detail" id="detailsPanel" readonly="true">
            <xp:text escape="true" id="computedField1">
            <xp:this.value><![CDATA[{javascript:
viewEntry.getDocument().getItemValueString("Address") + ",      " +
viewEntry.getDocument().getItemValueString("City") + ", " +
viewEntry.getDocument().getItemValueString("State")}]]>
                    </xp:this.value>
            </xp:text>
   </xp:panel>
<\xp:this.facets>

How do I code my summary facet to show/hide the details facet when clicked?

Answer 1

As stated by @Mikael in Domino 9 the toggleDetailVisible function does not seem to work. Based on a suggestion from Brad Balassaitis I got it working by getting a handle to the twistie object and clicking it.

var myid = "#{id:link3}";
var parts = myid.split(":");
var outparts = [];
for(var idx=0; idx<parts.length-1; idx++){
    outparts[idx] = parts[idx];
}
outparts[outparts.length-1] += "_shimg";
var bid = outparts.join(":");

var btn = document.getElementById(bid);
btn.click();