Enable - disable button in a p:datatable primefaces / jsf

Question

I have a <p:datatable> with a list of people, each row has a buttom for enable/disable the person. this button has just the function of changing the status (active / not active) of the user. For showing the users I have a like this :

<h:outputLabel value="Status" />
<h:selectOneMenu value="#{pessoaBean.ativo}">
    <f:selectItem itemLabel="Todos" itemValue="-1" />
    <f:selectItem itemLabel="Ativo" itemValue="1" />
    <f:selectItem itemLabel="Inativo" itemValue="0" />
</h:selectOneMenu>

This allows me to show just active user, or not active user. This is working well. My problem is that when I have an active list of people I would like to have button A and when a person is not active I would like to show button B. Each of the button (A and B) has the function of changing the status of the user, but obviously one button changes active in not active and the opposite.

My p:datatable is the follow :

<p:dataTable value="#{pessoaBean.pessoas}" var="pes" id="tabelaUsuarios"
             paginator="true" rows="10" emptyMessage="Nenhum registro encontrado"
             sortOrder="acending"   selectionMode="single" rowKey="#{pes.cdPessoa}" 
             rendered="#{pessoaBean.pessoas != null}"
             paginatorPosition="bottom"  scrollable="false">
    <p:column headerText="Nome">
        #{pes.nmPessoa}
    </p:column>
    <p:column headerText="Email" >
        #{pes.email}
    </p:column>
    <p:column headerText="Status">
        #{pes.flAtivo}
    </p:column>
    <p:column>
        <h:commandButton action="#{pessoaBean.bloquear}"  value="Bloquear" 
                         class="btn btn-default"  >
            <f:param value="#{pes.cdPessoa}" name="id" />
        </h:commandButton>
    </p:column>                 
</p:dataTable>

Does someone know how I can get this result? Just show button A with active person and button B with inactive?

Answer 1

You can achieve that by having two buttons inside the same column with opposite or different rendered attributes. If "Bloquear" is the button you are referring to, it would be something like this:

<p:column>
    <h:commandButton action="#{pessoaBean.bloquear}" value="Bloquear" 
                     rendered="#{pes.flAtivo eq 1}" class="btn btn-default">
        <f:param value="#{pes.cdPessoa}" name="id" />
    </h:commandButton>
    <h:commandButton action="#{pessoaBean.desbloquear}" value="Desbloquear" 
                     rendered="#{pes.flAtivo eq 0}" class="btn btn-default" >
        <f:param value="#{pes.cdPessoa}" name="id" />
    </h:commandButton>
</p:column> 

By the way you have a typo, it should be sortOrder="ascending"