轮询更新后无法关闭列切换 [英] Can't close columntoggler after poll updates

问题描述

首先，我要感谢Stack Overflow如此出色的功能并回答了我们几乎所有需要的内容.但是我仍然坚持并需要 Help .我的问题是我的columntoggler右上角没有关闭按钮(因此，当p:poll更新数据表时，toggle不会关闭，并且每次我都要刷新整个页面时:().因此，我们是否需要jquery来添加该内容或其他内容我做错了.请建议我.谢谢

First of all I'd like to thank Stack overflow for being such awesome and answering almost everything we need.But again I've stuck to something and need Help.My problem is that my columntoggler does not have a close button on the top right(So, when p:poll updates the datatable,toggle does not close and everytime I've to refresh the whole page :( ).So,Do we need jquery to add that or something that I'm doing wrong.Please suggest me.Thank you

<h:form rendered="#{bean.value!=null}"  >

    <p:dataTable id="tab" var="var" value="#{bean.value}" >

                 <f:facet name="header">
                    Header for dataTable
                    <p:commandButton style="float:right" id="toggler" type="button" value="Columns"  icon="ui-icon-calculator" />
                    <p:columnToggler datasource="tab" trigger="toggler">
                     <p:ajax event="toggle" listener="#{bean.onToggle}" />

                        </p:columnToggler>


                 </f:facet>
    <p:column visible="#{bean.list[0]}">
            <f:facet name="header"><h:outputText value="Start"/>
            </f:facet>
            <h:outputText value="#{var.startTime}">
                <f:convertDateTime pattern="dd.MM.yyyy" />
            </h:outputText>
        </p:column>

        <p:column visible="#{bean.list[1]}">
            <f:facet name="header"><h:outputText value="End"/>
            </f:facet>
            <h:outputText value="#{var.endTime}" >
                <f:convertDateTime pattern="dd.MM.yyyy"  />
            </h:outputText>
        </p:column>

        <p:column visible="#{bean.list[2]}">
            <f:facet name="header"><h:outputText value="Name"/>
            </f:facet>
            <h:outputText value="#{var.name}" >

            </h:outputText>
        </p:column>

        </p:dataTable>

        <p:poll interval="10"  update="tab" />
   </h:form>

推荐答案

案例1:您可以在触发切换事件"时使用onstart()/oncomplete()使用PF('widgetVar').hide关闭columnToggler.等

Case 1: You can close the columnToggler, when the 'toggle event' is triggered, using PF('widgetVar').hide using onstart()/oncomplete() etc.

<p:columnToggler datasource="tab" trigger="toggler" widgetVar="colTogglerWidgetVar">
                 <p:ajax event="toggle" listener="#{bean.onToggle}"  
                  onstart="PF('colTogglerWidgetVar').hide();" />
</p:columnToggler>

情况2:即使仅在使用onstart()事件触发使用PF().hide触发切换事件的同时更新表，也可以使用columnToggler！因为当您更新表格时，一组新的元素将以相同的签名添加到页面，但是仍然向您开放的columnToggler将是较旧的元素，因此，如果您尝试使用关闭按钮关闭columnTogller，它将赢得没有关闭.由于对话框已失去当前状态的作用域.

Case 2: You can the columnToggler, even when the table is updated while the toggle event is triggered using PF().hide by using onstart() event only!! Because when you update the table, a new set of elements are add to page with the same signatures but the columnToggler which is still open to you will be the older one and hence if you try to close the columnTogller using the close button, it won't close. Since the dialog has lost its scope with the current state.

因此，除onstart()之外的任何其他事件均无用.

Therefore any other event other than onstart() wont serve the purpose.

<p:columnToggler datasource="tab" trigger="toggler" widgetVar="colTogglerWidgetVar">
                 <p:ajax event="toggle" listener="#{bean.onToggle}"   
                 onstart="PF('colTogglerWidgetVar').hide();" update="datatable"/>
</p:columnToggler>

如果您希望保持对话框打开状态，即使您隐藏了columnToggler，也可以使用PF().show和onComplete()组合

If you wish to keep the dialog open,even after you hide the columnToggler, then go for showing the columnToggler again using PF().show with onComplete() combination

<p:columnToggler datasource="tab" trigger="toggler" widgetVar="colTogglerWidgetVar">
                 <p:ajax event="toggle" listener="#{bean.onToggle}"   
                 onstart="PF('colTogglerWidgetVar').hide();" 
                 oncomplete="PF('colTogglerWidgetVar').show();" update="datatable"  />
</p:columnToggler>

这篇关于轮询更新后无法关闭列切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！