Mark or uncheck selectBooleanCheckbox when clicking another

Asked

Viewed 1,427 times

0

Hello, I have the following situation: On my jsf page I have some components selectBooleanCheckbox. I need that when clicking on one of them some others are unchecked, and also disabled, making it impossible to select. Is it possible? If yes, does anyone have any information, material that can help me? Thank you

xhtml:

<h:selectBooleanCheckbox value="#{simpleReport.colunaCliente}" />
                    <h:outputText escape="false" value="Cliente" />
                    <h:selectBooleanCheckbox value="#{simpleReport.colunaCondutor}" />
                    <h:outputText escape="false" value="Condutor" />
                    <h:selectBooleanCheckbox
                        value="#{simpleReport.colunaCondicaoTempo}" />
                    <h:outputText escape="false" value="Cond. Tempo" />
                    <h:selectBooleanCheckbox value="#{simpleReport.colunaOcorrencia}" />
                    <h:outputText escape="false" value="Ocorrência" />

In the bean:

boolean colunaId = false, colunaCliente = false, colunaCondutor = false, colunaPeriodo = false,
        colunaCondicaoTempo = false, colunaStatus = false, colunaOcorrencia = false, colunaSoma = false,
        colunaQtdCond = false, colunaQtdCli = false;

inserir a descrição da imagem aqui

Update 01:

xhtml

<p:toolbar id="colunas" style="margin-top: 20px">
                <p:toolbarGroup>
                    <h:selectBooleanCheckbox id="id" value="#{simpleReport.colunaId}" />
                    <h:outputText escape="false" value="Cód." />
                    <h:selectBooleanCheckbox id="cli"
                        value="#{simpleReport.colunaCliente}" />
                    <h:outputText escape="false" value="Cliente" />
                    <h:selectBooleanCheckbox id="cond"
                        value="#{simpleReport.colunaCondutor}" />
                    <h:outputText escape="false" value="Condutor" />
                    <h:selectBooleanCheckbox id="CondTemp"
                        value="#{simpleReport.colunaCondicaoTempo}" />
                    <h:outputText escape="false" value="Cond. Tempo" />
                    <h:selectBooleanCheckbox id="ocor"
                        value="#{simpleReport.colunaOcorrencia}" />
                    <h:outputText escape="false" value="Ocorrência" />
                    <h:selectBooleanCheckbox id="sta"
                        value="#{simpleReport.colunaStatus}" />
                    <h:outputText escape="false" value="Status" />
                    <h:selectBooleanCheckbox id="per"
                        value="#{simpleReport.colunaPeriodo}" />
                    <h:outputText escape="false" value="Período" />
                    <h:selectBooleanCheckbox id="soma"
                        value="#{simpleReport.colunaSoma}" />
                    <h:outputText escape="false" value="Soma" />
                    <h:selectBooleanCheckbox id="qtdCli"
                        value="#{simpleReport.colunaQtdCli}" />
                    <h:outputText escape="false" value="QtdCli" />
                    <h:selectBooleanCheckbox value="#{simpleReport.colunaQtdCondTemp}" />
                    <h:outputText escape="false" value="Qtd Cond Temp." />


                </p:toolbarGroup>
            </p:toolbar>

            <p:toolbar style="margin-top: 20px">
                <p:toolbarGroup>
                    <p:selectBooleanCheckbox id="groupCLiente"
                        value="#{simpleReport.groupByCLiente}">
                        <p:ajax update="id cond CondTemp ocor sta per"
                            listener="#{simpleReport.resetValue1}" />
                        <h:outputText escape="false" value="Cliente" />
                    </p:selectBooleanCheckbox>

                    <p:selectBooleanCheckbox id="groupCondicao"
                        value="#{simpleReport.groupByCondicaoTempo}">
                        <p:ajax update="id cond CondTemp ocor sta per"
                            listener="#{simpleReport.resetCondicaoTempo}" />
                        <h:outputText escape="false" value="Condição" />
                    </p:selectBooleanCheckbox>
                </p:toolbarGroup>

            </p:toolbar>

In the bean:

public void resetValue1() {
    this.colunaId = false;
    this.colunaCondutor = false;
    this.colunaCondicaoTempo = false;
    this.colunaOcorrencia = false;
    this.colunaStatus = false;
    this.colunaPeriodo = false;
    this.colunaSoma = false;
}

public void resetCondicaoTempo() {
    this.colunaId = false;
    this.colunaCondutor = false;
    this.colunaOcorrencia = false;
    this.colunaStatus = false;
    this.colunaPeriodo = false;
    this.colunaSoma = false;
}

public void resetCondutor() {
    this.colunaId = false;
    this.colunaCondicaoTempo = false;
    this.colunaOcorrencia = false;
    this.colunaStatus = false;
    this.colunaPeriodo = false;
    this.colunaSoma = false;
}

Update02:

xhtml:

<h:selectBooleanCheckbox id="id" value="#{simpleReport.colunaId}"
                        disabled="#{simpleReport.groupByCLiente || simpleReport.groupByCondicaoTempo}"
                        enabled="#{not simpleReport.groupByCLiente}"/>
jsf primefaces

  • I found this post on Soen : http://stackoverflow.com/questions/8709112/single-select-checkbox-using-jsf is basically what I need but I couldn’t implement it yet because, in my case, by clicking on one of selectBooleanCheckboxI need to clear more than one.

  • 1

    I don’t know if this fits your need, but you couldn’t use a Radiogroup Checkbox instead

  • @ R.Santos I believe that due to the various options I need to control would not be a good option. Thank you.

2 answers

2

Another solution, using the enable/disable implementation in groups.

inserir a descrição da imagem aqui

In XHTML:

<p:toolbar id="colunas" style="margin-top: 20px">
    <p:toolbarGroup>
        <h:selectBooleanCheckbox value="#{controlador.colunaId}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Cód." />

        <h:selectBooleanCheckbox value="#{controlador.colunaCliente}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Cliente" />

        <h:selectBooleanCheckbox value="#{controlador.colunaCondutor}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Condutor" />

        <h:selectBooleanCheckbox value="#{controlador.colunaCondicaoTempo}" disabled="#{controlador.groupByCLiente}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Cond. Tempo" />

        <h:selectBooleanCheckbox value="#{controlador.colunaOcorrencia}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Ocorrência" />

        <h:selectBooleanCheckbox value="#{controlador.colunaStatus}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Status" />

        <h:selectBooleanCheckbox value="#{controlador.colunaPeriodo}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Período" />

        <h:selectBooleanCheckbox value="#{controlador.colunaSoma}" disabled="#{controlador.groupByCLiente || controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Soma" />

        <h:selectBooleanCheckbox value="#{controlador.colunaQtdCli}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="QtdCli" />

        <h:selectBooleanCheckbox value="#{controlador.colunaQtdCond}">
            <p:ajax update="colunas" />
        </h:selectBooleanCheckbox>
        <h:outputText value="Qtd Cond Temp." />
    </p:toolbarGroup>
</p:toolbar>

<p:toolbar style="margin-top: 20px">
    <p:toolbarGroup>
        <h:selectBooleanCheckbox value="#{controlador.groupByCLiente}">
            <p:ajax update="colunas" />
            <h:outputText value="Cliente" />
        </h:selectBooleanCheckbox>

        <h:selectBooleanCheckbox value="#{controlador.groupByCondicaoTempo}">
            <p:ajax update="colunas" />
            <h:outputText value="Condição" />
        </h:selectBooleanCheckbox>
    </p:toolbarGroup>
</p:toolbar>

No Bean:

private boolean colunaId = false,
                colunaCliente = false,
                colunaCondutor = false,
                colunaPeriodo = false,
                colunaCondicaoTempo = false,
                colunaStatus = false,
                colunaOcorrencia = false,
                colunaSoma = false,
                colunaQtdCond = false,
                colunaQtdCli = false,
                groupByCLiente = false,
                groupByCondicaoTempo = false;

public boolean getColunaId() {
    return this.colunaId;
}

public void setColunaId(boolean colunaId) {
    this.colunaId = colunaId;
}

public boolean getColunaCliente() {
    return this.colunaCliente;
}

public void setColunaCliente(boolean colunaCliente) {
    this.colunaCliente = colunaCliente;
}

public boolean getColunaCondutor() {
    return this.colunaCondutor;
}

public void setColunaCondutor(boolean colunaCondutor) {
    this.colunaCondutor = colunaCondutor;
}

public boolean getColunaPeriodo() {
    return this.colunaPeriodo;
}

public void setColunaPeriodo(boolean colunaPeriodo) {
    this.colunaPeriodo = colunaPeriodo;
}

public boolean getColunaCondicaoTempo() {
    return this.colunaCondicaoTempo;
}

public void setColunaCondicaoTempo(boolean colunaCondicaoTempo) {
    this.colunaCondicaoTempo = colunaCondicaoTempo;
}

public boolean getColunaStatus() {
    return this.colunaStatus;
}

public void setColunaStatus(boolean colunaStatus) {
    this.colunaStatus = colunaStatus;
}

public boolean getColunaOcorrencia() {
    return this.colunaOcorrencia;
}

public void setColunaOcorrencia(boolean colunaOcorrencia) {
    this.colunaOcorrencia = colunaOcorrencia;
}

public boolean getColunaSoma() {
    return this.colunaSoma;
}

public void setColunaSoma(boolean colunaSoma) {
    this.colunaSoma = colunaSoma;
}

public boolean getColunaQtdCond() {
    return this.colunaQtdCond;
}

public void setColunaQtdCond(boolean colunaQtdCond) {
    this.colunaQtdCond = colunaQtdCond;
}

public boolean getColunaQtdCli() {
    return this.colunaQtdCli;
}

public void setColunaQtdCli(boolean colunaQtdCli) {
    this.colunaQtdCli = colunaQtdCli;
}

public boolean getGroupByCLiente() {
    return this.groupByCLiente;
}

public void setGroupByCLiente(boolean groupByCLiente) {
    this.groupByCLiente = groupByCLiente;
    this.resetByCliente(false);
}

public boolean getGroupByCondicaoTempo() {
    return this.groupByCondicaoTempo;
}

public void setGroupByCondicaoTempo(boolean groupByCondicaoTempo) {
    this.groupByCondicaoTempo = groupByCondicaoTempo;
    this.resetByCondicaoTempo(false);
}

public void resetByCliente(boolean valor) {
    this.colunaId = valor;
    this.colunaCondutor = valor;
    this.colunaCondicaoTempo = valor;
    this.colunaOcorrencia = valor;
    this.colunaStatus = valor;
    this.colunaPeriodo = valor;
    this.colunaSoma = valor;
}

public void resetByCondicaoTempo(boolean valor) {
    this.colunaId = valor;
    this.colunaCondutor = valor;
    this.colunaOcorrencia = valor;
    this.colunaStatus = valor;
    this.colunaPeriodo = valor;
    this.colunaSoma = valor;
}

2

Maybe the component Radio may be an alternative, but if you need a more personalized control, you can try doing it as follows:

Upshot:

inserir a descrição da imagem aqui

In XHTML:

<h:panelGroup id="pnlOpcoes">
<h:selectBooleanCheckbox value="#{controlador.opcao1}" disabled="#{controlador.selecionouAlgumCheck()}">
    <p:ajax update="pnlOpcoes" />
</h:selectBooleanCheckbox>
<h:outputText escape="false" value="Opção 1 - Ativa se nenhuma estiver ativa" />
<br />

<h:selectBooleanCheckbox value="#{controlador.subOpcao1}" disabled="#{not controlador.opcao1}" />
<h:outputText escape="false" value="Opção ativa somente se a 1 estiver ativa" />
<br />

<h:selectBooleanCheckbox value="#{controlador.opcao2}" disabled="#{controlador.selecionouAlgumCheck()}">
    <p:ajax update="pnlOpcoes" />
</h:selectBooleanCheckbox>
<h:outputText escape="false" value="Opção 2 - Ativa se nenhuma estiver ativa" />
<br />

<h:selectBooleanCheckbox value="#{controlador.subOpcao2}" disabled="#{not controlador.opcao2}">
    <p:ajax update="pnlOpcoes" />
</h:selectBooleanCheckbox>
<h:outputText escape="false" value="Opção ativa somente se a 2 estiver ativa" />
<br />

<h:selectBooleanCheckbox value="#{controlador.opcao3}" disabled="#{controlador.selecionouAlgumCheck()}">
    <p:ajax update="pnlOpcoes" />
</h:selectBooleanCheckbox>
<h:outputText escape="false" value="Opção 3 - Ativa se nenhuma estiver ativa" />
<br />

<h:selectBooleanCheckbox value="#{controlador.opcao4}" disabled="#{controlador.selecionouAlgumCheck() and not controlador.opcao2}">
    <p:ajax update="pnlOpcoes" />
</h:selectBooleanCheckbox>
<h:outputText escape="false" value="Opção 4 - Ativa somente se nenhuma estiver ativa ou se a 2 estiver ativa" /><br />
</h:panelGroup>

<p />

<p:commandButton action="#{controlador.inicializarCheck()}" update="pnlOpcoes" value="Reset" />

No Bean:

private boolean opcao1;
private boolean subOpcao1;

private boolean opcao2;
private boolean subOpcao2;

private boolean opcao3;
private boolean opcao4;

public boolean isOpcao1() {

    return this.opcao1;
}

public void setOpcao1(boolean opcao1) {

    this.inicializarCheck();
    this.opcao1 = opcao1;
}

public boolean isSubOpcao1() {

    return this.subOpcao1;
}

public void setSubOpcao1(boolean subOpcao1) {

    this.subOpcao1 = subOpcao1;
}

public boolean isOpcao2() {

    return this.opcao2;
}

public void setOpcao2(boolean opcao2) {

    this.inicializarCheck();
    this.opcao2 = opcao2;
}

public boolean isSubOpcao2() {

    return this.subOpcao2;
}

public void setSubOpcao2(boolean subOpcao2) {

    this.subOpcao2 = subOpcao2;
}

public boolean isOpcao3() {

    return this.opcao3;
}

public void setOpcao3(boolean opcao3) {

    this.inicializarCheck();
    this.opcao3 = opcao3;
}

public boolean isOpcao4() {

    return this.opcao4;
}

public void setOpcao4(boolean opcao4) {

    boolean opcao2 = this.opcao2;
    boolean subOpcao2 = this.subOpcao2;
    this.inicializarCheck();
    this.opcao4 = opcao4;
    this.opcao2 = opcao2;
    this.subOpcao2 = subOpcao2;
}

public void inicializarCheck() {
    this.opcao1 = false;
    this.subOpcao1 = false;
    this.opcao2 = false;
    this.subOpcao2 = false;
    this.opcao3 = false;
    this.opcao4 = false;
}

public boolean selecionouAlgumCheck() {
    return this.opcao1 || this.opcao2 || this.opcao3 || this.opcao4;
}

  • I got something in the meantime, since I posted the doubt, then put the codes and also calmly see your answer, thank you.

  • @ Marcus Martins added the codes I’m currently using ( update 01), now I’ll see your answer. But I’ve noticed that your code at first sight already makes it impossible for the user to select the disabled options, which is quite interesting, in mine just uncheck the desired options.

  • Glad you could work it out. If you need help, you can ask.

  • No problem, I still haven’t been able to "adapt" your suggestion in my code. When do I return! Thank you

  • @ Marcus Martins could help me to make that by selecting (for example) the selectBooleanCheckbox groupCLiente options that are unchecked due to your selection are also disabled by disabling your selection ? Until it (groupCliente)be desiccated? Thank you.

  • I added another piece of code, I only used one part of @Marcus Martins' suggestion and adapted it to my code, it’s in : update02, now it’s disabling the selectBooleanCheckBox specified when I select another, and when deselecting what was selected, it is enabling again ( disabled). I still need to make other adjustments (others selectBooleanCheckBox ) but I think I’m on my way. Like these selectBooleanCheckBox will alter my queryit is important to "disable" and be able to "enable" them again in clicks.

  • @Rodrigo, I’m sorry to keep you waiting, but I couldn’t access it until today. I posted another example with the option to enable/disable in groups, using your groupByClient / groupByCondicationTempo.

Show 2 more comments

Browser other questions tagged jsf primefaces

You are not signed in. Login or sign up in order to post.