Primefaces：在数据表中隐藏/显示确切的过滤器

Question

我正在创建一个带有过滤器的数据表，其中使用selectBooleanButton可以显示/隐藏过滤器。我可以隐藏文本过滤器，但“精确”过滤器的选择框不会隐藏。代码如下。我将不胜感激任何帮助。

<p:dataTable id="orgs" var="id" widgetVar="idTable" 
value="#{orgList.ids}" rows="10" 
rowKey="#{id.idPk}" 
paginator="true" paginatorPosition="top" 
selectionMode="single" 
selection="#{orgList.selectedOrg}" 
filteredValue="#{orgList.filteredValues}" 
> 

<f:facet name="header"> 
    <p:toolbar id="orgListToolbar"> 
     <p:toolbarGroup align="right"> 
      <p:selectBooleanButton value="#{orgList.showFilter}" onIcon="myfilter" offIcon="ui-icon-minusthick" onLabel="F" offLabel="F"> 
       <p:ajax update="orgs" oncomplete="idTable.clearFilters()"/> 
      </p:selectBooleanButton> 
     </p:toolbarGroup> 
    </p:toolbar> 
</f:facet> 


<p:column sortBy="#{id.id}" headerText="Id" filterBy="#{id.id}" filterStyle="#{orgList.showFilter?'':'display: none; visibility: hidden;'}"> 
    <h:outputText value="#{id.id}" /> 
</p:column> 
<p:column sortBy="#{id.idCls.clsName}" headerText="Id Type"    
     filterBy="#{id.idCls.clsName}" filterMatchMode="exact" filterOptions="#{commonLists.selectItemIdClses}" 
     filterStyle="#{orgList.showFilter?'':'display: none; visibility: hidden;'}" > 
    <h:outputText value="#{id.idCls.clsName}" /> 
</p:column> 

Answer 1

这是因为Primefaces覆盖你的filterStyle

你可以做到以下几点：

在您的自定义CSS文件中添加以下（id是你的表ID）

#id .ui-column-filter{ 
display:none; 
} 

确认您在结束你的CSS ...（你可以装载在机身的CSS）这样

<h:body> 
    <h:outputStylesheet library="css" name="myCssFile.css" target="head" /> 

注意display: none;就足够了，没有必要为visibility: hidden;所有

---

在为了隐藏/显示您可以使用jQuery .hide()/.show()功能的过滤器与适当的selectos

例如：

$("#form\\:dataTable th select").hide();//.show 

$("#form\\:dataTable th input").hide();//.show 

检查它在DataTable - Filtering（在你的浏览器开发者工具控制台）