Primefaces checkboxes selected all by JQuery not working properly

Question

I'm using JQuery to select a group of checkboxes... Visually it works fine. The first time, all checks are submitted fine as true. But if I select all, click again to unselect all, and again to select all, when I submit the form, for JSF all of them are evaluated as false.

function selectAllByClass(checkAll , classeCheckbox) {

var checked = checkAll.checked;

//to change the checked attribute                
$('div.' + classeCheckbox + ' input[type=checkbox]').attr('checked',
        checked);

if (checked) {

    $('div.' + classeCheckbox + ' > div.ui-chkbox-box').each(function() {
        $(this).addClass('ui-state-active');

        $(this).children('span').addClass('ui-icon ui-icon-check');

    });
} else {

    $('div.' + classeCheckbox + ' > div.ui-chkbox-box').each(function() {
        $(this).removeClass('ui-state-active');

        $(this).children('span').removeClass('ui-icon ui-icon-check');

    });
}

}

<p:outputPanel
                    id="parcelasPanel"
                    deferred="true"
                    deferredMode="visible"
                    delay="10"
                    styleClass="togglePanelEscondido escondido">

                    <p:dataTable styleClass="tabela_sgi"
                        value="#{cobranca.parcelas}"
                        var="parcela">

                        <p:column
                            headerText="Nº do Boleto(s)"
                            styleClass="alinhar_centro">
                            <h:outputText value="#{parcela.numeroBoleto}" />
                        </p:column>

                        <p:column
                            headerText="Nº Parcela(s)"
                            styleClass="alinhar_centro">
                            <h:outputText value="#{parcela.numeroParcela}/#{cobranca.quantidadeParcelas}" />
                        </p:column>

                        <p:column
                            headerText="Nº Reemissões"
                            styleClass="alinhar_centro">
                            <h:outputText value="#{parcela.numeroReemissoes}" />
                        </p:column>

                        <p:column
                            headerText="Vencimento"
                            styleClass="alinhar_centro">
                            <h:outputText value="#{parcela.dataVencimento}">
                                <f:convertDateTime />
                            </h:outputText>
                        </p:column>

                        <p:column
                            headerText="Valor"
                            styleClass="alinhar_direita">
                            <h:outputText value="#{parcela.valor}">
                                <f:convertNumber
                                    type="currency"
                                    currencyCode="BRL" />
                            </h:outputText>
                        </p:column>

                        <p:column
                            headerText="Valor Atualizado"
                            styleClass="alinhar_direita">
                            <h:outputText value="#{parcela.valorAtualizado}">
                                <f:convertNumber
                                    type="currency"
                                    currencyCode="BRL" />
                            </h:outputText>
                        </p:column>

                        <p:column
                            headerText="Situação"
                            styleClass="alinhar_centro tamanho_col_situacao">
                            <h:outputText value="#{parcela.situacao}" styleClass="bold" />
                        </p:column>

                        <p:column
                            headerText="Negociar"
                            styleClass="alinhar_centro tamanho_col_negocias">
                            <p:selectBooleanCheckbox
                                value="#{negociacaoBaseBean.parcelasSelecionadas[parcela]}"
                                disabled="#{!negociacaoBaseBean.tipoNegociacaoSelecionado.aceitaParcelas or (negociacaoBaseBean.tipoNegociacaoSelecionado.eReemissaoENaoPodeReemitir(parcela.podeReemitir))}"
                                styleClass="#{negociacaoBaseBean.tipoNegociacaoSelecionado.aceitaParcelas and !(negociacaoBaseBean.tipoNegociacaoSelecionado.eReemissaoENaoPodeReemitir(parcela.podeReemitir))?'selecionaParcelaOn':'selecionaParcelaOff'}">

                            </p:selectBooleanCheckbox>
                        </p:column>

                    </p:dataTable>


                </p:outputPanel>

arjabbar arjabbar · Accepted Answer · 2015-08-27T14:22:44

Use prop() instead of attr(). You need to change the actual property on the element, not just the attribute.

Primefaces checkboxes selected all by JQuery not working properly

1 Answers