java - Primefaces Panels inside OrderList -

i'd implement reordering of list elements using p:orderlist , p:panel components. there pojos in list, problem occurs list of strings.

there bean:

public class backingbean {      private list<string> list;      public void adddate() {         list.add(new date().tostring());     }          // getters , setters... } 

my page source:

<p:orderlist id="videos" value="#{bean.list}" var="date" itemvalue="#{date}"     controlslocation="none">     <p:column >         <p:panel header="#{date}" toggleable="true" togglespeed="500">             fc barcelona 1 of 3 clubs...         </p:panel>     </p:column> </p:orderlist> 

the problem every time toggle 1 of panels, panels minimized , maximized few times, i.e. if there 3 elements in list, panels maximized/minimized 3 times. wrong?

well, depends if need reordering functionality. if can afford go without it, try ui:repeat instead of p:orderlist. generates original id every div able toggle 1 panel @ time. hope helps

edit: made custom "toggler" can toggle panels in p:orderlist separately.

        <p:orderlist id="videos" value="#{yourbean.list}" var="dataitem" itemvalue="#{dataitem}"                      controlslocation="none">             <p:column>                 <p:panel id="togglepanel">                         <f:facet name="header">                             <h:outputtext value="#{dataitem}" />                             <p:commandbutton value="+" onclick="showtoggle(this)" style="float: right;"/>                             <p:commandbutton value="-" onclick="hidetoggle(this)" style="float: right;"/>                             <div style="clear: both"/>                         </f:facet>                     <div>                         fc barcelona 1 of 3 clubs...                     </div>                 </p:panel>             </p:column>         </p:orderlist> 

and simple script :

<script type="text/javascript">   function hidetoggle(param) {       jquery(param).closest("div").next().slideup('slow',null);      }   function showtoggle(param) {       jquery(param).closest("div").next().slidedown('slow',null);      }  </script>  

maybe there nicer solution believe point. hope helped.