backbase How to dynamically hide or display some columns

How to dynamically hide or display some columns (which is still keep its setting after refreshed it.)?

顯示和隱藏某些列可以通過顯示和隱藏相應的b:datagridheadcell來實現，例如：

<b:button>
    Hide the 3rd column
    <s:event b:on="command">
        <s:task b:action="hide" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>
    s:event>
b:button>
<b:button>
    Show the 3rd column
    <s:event b:on="command">
        <s:task b:action="show" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>
    s:event>
b:button>

 

 

B:listgrid和b:datagrid內置不支持狀態保存。如果要在整個頁面刷新之後保留住刷新之前的狀態，可以手動紀錄先前的狀態到cookie中，待頁面刷新的時候根據先前的狀態顯示或者隱藏某些列。上面的代碼可以作如下更改來實現此功能：

xml 代碼

<b:button>
    Hide the 3rd column
    <s:event b:on="command">
        <s:task b:action="hide" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>

        <s:task b:action="setcookie" b:name="{'datagrid1-hidden-column',3}" b:value="true" b:days="100" />
    s:event>
b:button>
<b:button>
    Show the 3rd column
    <s:event b:on="command">
        <s:task b:action="show" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>

        <s:task b:action="setcookie" b:name="{'datagrid1-hidden-column',3}" b:value="" b:days="100" />
    s:event>
b:button>

 

相應地，在datagrid1的construct事件中，檢測每一個列在cookie中相應的隱藏狀態來有選擇地隱藏列：

xml 代碼

<b:datagrid id="datagrid1"  … >
   <b:datagridhead>
      <b:datagridrow>
         <b:datagridheadcell />
         <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="text">Titleb:datagridheadcell>
         <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="radio">Directorb:datagridheadcell>
         <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="genre">Genreb:datagridheadcell>
         <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="checkbox">Languageb:datagridheadcell>
         <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="datepicker" b:sorttype="string">Premiereb:datagridheadcell>
      b:datagridrow>
   b:datagridhead>
   <b:datagridbody />
   <s:event b:on="construct">
    <s:super/>

    <s:with b:target="b:datagridhead/b:datagridrow/b:datagridheadcell">
        <s:task b:action="hide" b:test="cookie(concat('datagrid1-hidden-column',position()))='true'"/>
    s:with>
    s:event>

b:datagrid>

 

xml 代碼