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来实现，例如：

 

1. <b:button>  
2.     Hide the 3rd column   
3.     <s:event b:on="command">  
4.         <s:task b:action="hide" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>        
5.     s:event>  
6. b:button>  
7. <b:button>  
8.     Show the 3rd column   
9.     <s:event b:on="command">  
10.         <s:task b:action="show" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>        
11.     s:event>  
12. b:button>  

 

 

B:listgrid和b:datagrid内置不支持状态保存。如果要在整个页面刷新之后保留住刷新之前的状态，可以手动纪录先前的状态到cookie中，待页面刷新的时候根据先前的状态显示或者隐藏某些列。上面的代码可以作如下更改来实现此功能：

xml 代码

 

1.   
2. <b:button>  
3.     Hide the 3rd column   
4.     <s:event b:on="command">  
5.         <s:task b:action="hide" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>    
6.         
7.         <s:task b:action="setcookie" b:name="{'datagrid1-hidden-column',3}" b:value="true" b:days="100" />  
8.     s:event>  
9. b:button>  
10. <b:button>  
11.     Show the 3rd column   
12.     <s:event b:on="command">  
13.         <s:task b:action="show" b:target="id('datagrid1')/b:datagridhead/b:datagridrow/b:datagridheadcell[3]"/>    
14.         
15.         <s:task b:action="setcookie" b:name="{'datagrid1-hidden-column',3}" b:value="" b:days="100" />  
16.     s:event>  
17. b:button>  

 

相应地，在datagrid1的construct事件中，检测每一个列在cookie中相应的隐藏状态来有选择地隐藏列：

xml 代码

 

1.   
2. <b:datagrid id="datagrid1"  … >  
3.    <b:datagridhead>  
4.       <b:datagridrow>  
5.          <b:datagridheadcell />  
6.          <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="text">Titleb:datagridheadcell>  
7.          <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="radio">Directorb:datagridheadcell>  
8.          <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="genre">Genreb:datagridheadcell>  
9.          <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="checkbox">Languageb:datagridheadcell>  
10.          <b:datagridheadcell b:behavior="my-datagrid-headcell" b:datatype="datepicker" b:sorttype="string">Premiereb:datagridheadcell>  
11.       b:datagridrow>  
12.    b:datagridhead>  
13.    <b:datagridbody />  
14.    <s:event b:on="construct">  
15.     <s:super/>  
16.     
17.     <s:with b:target="b:datagridhead/b:datagridrow/b:datagridheadcell">  
18.         <s:task b:action="hide" b:test="cookie(concat('datagrid1-hidden-column',position()))='true'"/>  
19.     s:with>  
20.     s:event>  
21.       
22. b:datagrid>  

 

xml 代码