Arun
Arun

Reputation: 3841

Dynamic table headers in html

I need to display the headers inside tag based upon a condition.

<th class="header"><h:outputText value="#{supplierScorecard.treeItemList[1].m1.header}" /> </th>

This is my current code. The requirement is like I need to display the particular header only if the value is present by some kind of JavaScript validation.

Note: I am not using JSF datatable here as the table header is separately printed.

Upvotes: 0

Views: 279

Answers (2)

erencan
erencan

Reputation: 3763

Put your tags inside outputPanel then give the condition to render attribute of outputPanel.

<h:panelGrid id="panel" rendered="#{YOUR_CONDITION}" columns="1">
        <h:panelGroup>           
         <th class="header"><h:outputText value="#{supplierScorecard.treeItemList[1].m1.header}" /> </th>
      </h:panelGroup>
</h:panelGrid>

If you want to hide it by javascript, wrap the <th> tags with a span and dynamicly change visibilty.

<span id="panel">  
    <th class="header"><h:outputText value="#{supplierScorecard.treeItemList[1].m1.header}" /> </th>
</span>

document.getElementById("panel").style.display = "none";
document.getElementById("panel").style.display = "block";

Upvotes: 0

Arun
Arun

Reputation: 3841

Ive put the tags inside a4j:outputpanel with rendered condition and worked fine.

<a4j:outputPanel rendered="#{supplierScorecard.treeItemList[1].m4.header ne null}">
                                                <th class="header  treeTableOthers fixed"><h:outputText value="#{supplierScorecard.treeItemList[1].m4.header}" /> </th>
                                                </a4j:outputPanel>

Thanks for the update #erencan

Upvotes: 1

Related Questions