Question

I created a sample to demonstrate. I have a view called “testView” with three columns referencing “field1”, “field2”, “field3”.

When I run this XPage all three columns in the display when it should not show the third column. Clicking the button does not hide the second column either.

Can anyone tell me what I have wrong?

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xe="http://www.ibm.com/xsp/coreex"
    xmlns:xc="http://www.ibm.com/xsp/custom">

    <xp:this.beforePageLoad><![CDATA[#{javascript:if ( sessionScope.showCol2 == null ) 
    sessionScope.showCol2 = true;}]]></xp:this.beforePageLoad>
    <xe:restService id="restService1">
        <xe:this.service>
            <xe:viewJsonService viewName="testView"
                defaultColumns="true">
            </xe:viewJsonService>
        </xe:this.service>
    </xe:restService>
    <xp:panel style="margin-left:20.0px;margin-top:20.0px">
        <xe:listView id="listView1" storeComponentId="restService1">
            <xe:listViewColumn id="listViewColumn1" columnName="field1"
                columnTitle="Field1">
            </xe:listViewColumn>
            <xe:listViewColumn id="listViewColumn2" columnName="field2"
                columnTitle="Field2">
            <xe:this.rendered><![CDATA[#{javascript:return sessionScope.showCol2;
}]]></xe:this.rendered></xe:listViewColumn>
            <xe:listViewColumn id="listViewColumn3" columnName="field3"
                columnTitle="Field3" rendered="false">
            </xe:listViewColumn>
        </xe:listView></xp:panel>
    <xp:panel style="margin-top:20.0px;margin-left:20.0px">
        <xp:button id="button1" value="Toggle Column 2">
            <xp:eventHandler event="onclick" submit="true"
                refreshMode="partial" refreshId="listView1">
                <xp:this.action><![CDATA[#{javascript:if (     sessionScope.showCol2 == false ) { 
    sessionScope.showCol2 = true;
}
else { 
    sessionScope.showCol2 = false;
}}]]></xp:this.action>
            </xp:eventHandler></xp:button>
    </xp:panel></xp:view>

Answer 1

Looks like a bug in ExtLib. But you can hide the column in your code with hidden* property:

<xp:button id="button1" value="Toggle Column 2">
   <xp:eventHandler event="onclick" submit="true"
      refreshMode="partial" refreshId="listView1">
         <xp:this.action>
            <![CDATA[#{javascript:
               var cmp = getComponent('listViewColumn2');
               if( cmp.isHidden() ){
                  cmp.setHidden(false);
               }else{
                  cmp.setHidden(true);
               }
            }]]>
         </xp:this.action>
   </xp:eventHandler>
</xp:button>

*: the property is hidden too