Wednesday, August 26, 2020

How to hide reset button in af:query

 use below css to hide the RESET button in  af:query component

<af:resource type="css">

    button[id='pt1:r1:0:qryId2::reset'] {  

      display:none;

    }

  </af:resource>

Don't forget to change the id. Goto the browser development tools, find the id and replace in above code.


Above solution sometimes doesn't work in all browsers.

So use this solution

Write a class in .css file

.hideAfQueryReset af|query::content-footer > table > tbody > tr > td:last-child {

    display:none;

}

add that class to the af:query component

<af:query id="qryId1" headerText="Search" disclosed="true" 

value="#{bindings.VOCriteriaQuery.queryDescriptor}" 

model="#{bindings.VOCriteriaQuery.queryModel}" 

queryListener="#{bindings.VOCriteriaQuery.processQuery}" 

styleClass="hideAfQueryReset">

</af:query>

No comments:

Post a Comment