Logic error JavaScript

Question

In Javascript I'm having problems logically. The second function cancels the above function. What I do to solve?

OBS: I cant move the 'html' and use 'onclick'

$(document).ready(function(){
    $("input[name='wpcf-pde']").change(function() {
        if($(this).is(':checked')) {
         $("input[name='wpcf-pnps']").prop("disabled", "true");       
         $("input[name='wpcf-pspitlp']").prop("disabled", "true");
         $("input[name='wpcf-ppp']").prop("disabled", "true");
         $("input[name='wpcf-pto']").prop("disabled", "true"); 
         $("input[name='wpcf-pto2']").prop("disabled", "true");
         $("input[name='wpcf-pppa']").prop("disabled", "true"); 
         $("input[name='wpcf-ptl']").prop("disabled", "true");
         $("input[name='wpcf-ptpte']").prop("disabled", "true");
         $("input[name='wpcf-ptpti']").prop("disabled", "true"); 
         $("input[name='wpcf-ptc']").prop("disabled", "true"); 
         $("input[name='wpcf-psnl']").prop("disabled", "true");   
         $("input[name='wpcf-pcc']").prop("disabled", "true"); 

        } else {
         $("input[name='wpcf-pnps']").removeProp("disabled");
         $("input[name='wpcf-pspitlp']").removeProp("disabled");
         $("input[name='wpcf-ppp']").removeProp("disabled");
         $("input[name='wpcf-pto']").removeProp("disabled"); 
         $("input[name='wpcf-pto2']").removeProp("disabled");
         $("input[name='wpcf-pppa']").removeProp("disabled"); 
         $("input[name='wpcf-ptl']").removeProp("disabled");
         $("input[name='wpcf-ptpte']").removeProp("disabled");
         $("input[name='wpcf-ptpti']").removeProp("disabled"); 
         $("input[name='wpcf-ptc']").removeProp("disabled"); 
         $("input[name='wpcf-psnl']").removeProp("disabled");   
         $("input[name='wpcf-pcc']").removeProp("disabled"); 

        }
    }).change();

    $("input[name='wpcf-pspitlp']").change(function() {
        if(this.checked) {
         $("input[name='wpcf-pde']").prop("disabled", "true"); 
         $("input[name='wpcf-pnps']").prop("disabled", "true");       
         $("input[name='wpcf-ppp']").prop("disabled", "true");
         $("input[name='wpcf-pto']").prop("disabled", "true"); 
         $("input[name='wpcf-pto2']").prop("disabled", "true");
         $("input[name='wpcf-pppa']").prop("disabled", "true"); 
         $("input[name='wpcf-ptl']").prop("disabled", "true");
         $("input[name='wpcf-ptpte']").prop("disabled", "true");
         $("input[name='wpcf-ptpti']").prop("disabled", "true"); 
         $("input[name='wpcf-ptc']").prop("disabled", "true"); 
         $("input[name='wpcf-psnl']").prop("disabled", "true");   
         $("input[name='wpcf-pcc']").prop("disabled", "true"); 

        } else {
         $("input[name='wpcf-pde']").removeProp("disabled");
         $("input[name='wpcf-pnps']").removeProp("disabled");
         $("input[name='wpcf-pspitlp']").removeProp("disabled");
         $("input[name='wpcf-ppp']").removeProp("disabled");
         $("input[name='wpcf-pto']").removeProp("disabled"); 
         $("input[name='wpcf-pto2']").removeProp("disabled");
         $("input[name='wpcf-pppa']").removeProp("disabled"); 
         $("input[name='wpcf-ptl']").removeProp("disabled");
         $("input[name='wpcf-ptpte']").removeProp("disabled");
         $("input[name='wpcf-ptpti']").removeProp("disabled"); 
         $("input[name='wpcf-ptc']").removeProp("disabled"); 
         $("input[name='wpcf-psnl']").removeProp("disabled");   
         $("input[name='wpcf-pcc']").removeProp("disabled"); 



        }
    }).change();
});

HTML

<body>
    <div class="cred-field cred-field-pcb">
        <div class="cred-label">Pesquisas cadastradas</div>
            <input name="wpcf-pcb" id="pcb_Pesquisas_cadastradas" value="Pesquisas cadastradas" class="myzebra-prime-name-wpcf-pcb" type="checkbox"  >
        </div>
        <div class="cred-field cred-field-pde">
            <div class="cred-label">Pesquisas descontinuadas</div>
            <input name="wpcf-pde" id="pde_Pesquisas_descontinuadas" value="Pesquisas descontinuadas" class="myzebra-prime-name-wpcf-pde" type="checkbox" checked >
        </div>
        <div class="cred-field cred-field-pnps">
            <div class="cred-label">Pesquisas não patenteáveis/sigilosas</div>
            <input name="wpcf-pnps" id="pnps_Pesquisas_não_patenteáveis-sigilosas" value="Pesquisas não patenteáveis-sigilosas" class="myzebra-prime-name-wpcf-pnps" type="checkbox">
        </div>
        <div class="cred-field cred-field-pspitlp">
            <div class="cred-label">Pesquisas sem potencial de inovação tecnológica, liberadas para publicação</div>
            <input name="wpcf-pspitlp" id="pspitlp_Pesquisas_sem_potencial_de_inovação_tecnológica,_liberadas_para_publicação" value="Pesquisas sem potencial de inovação tecnológica, liberadas para publicação" class="myzebra-prime-name-wpcf-pspitlp" type="checkbox">
        </div>
        <div class="cred-field cred-field-ppp">
            <div class="cred-label">Pesquisas com pedido de patente</div>
            <input name="wpcf-ppp" id="ppp_Pesquisas_com_pedido_de_patente" value="Pesquisas com pedido de patente" class="myzebra-prime-name-wpcf-ppp" type="checkbox">
        </div>
        <div class="cred-field cred-field-pto">
            <div class="cred-label">Pesquisas com tecnologia em oferta</div>
            <input name="wpcf-pto" id="pto_Pesquisas_com_tecnologia_em_oferta" value="Pesquisas com tecnologia em oferta" class="myzebra-prime-name-wpcf-pto" type="checkbox">
        </div>
        <div class="cred-field cred-field-pto2">
            <div class="cred-label">Pesquisa com tecnologia em oferta pela 2ª vez</div>
            <input name="wpcf-pto2" id="pto2_Pesquisa_com_tecnologia_em_oferta_pela_2ª_vez" value="Pesquisa com tecnologia em oferta pela 2ª vez" class="myzebra-prime-name-wpcf-pto2" type="checkbox">
        </div>
        <div class="cred-field cred-field-pppa">
            <div class="cred-label">Pesquisas com pedido de patente abandonado</div>
            <input name="wpcf-pppa" id="pppa_Pesquisas_com_pedido_de_patente_abandonado" value="Pesquisas com pedido de patente abandonado" class="myzebra-prime-name-wpcf-pppa" type="checkbox">
        </div>
        <div class="cred-field cred-field-ptl">
            <div class="cred-label">Pesquisas com tecnologia licenciada</div>
            <input name="wpcf-ptl" id="ptl_Pesquisas_com_tecnologia_licenciada" value="Pesquisas com tecnologia licenciada" class="myzebra-prime-name-wpcf-ptl" type="checkbox">
        </div>
        <div class="cred-field cred-field-ptpte">
            <div class="cred-label">Pesquisas com titularidade de patente transferida para empresa</div>
            <input name="wpcf-ptpte" id="ptpte_Pesquisas_com_titularidade_de_patente_transferida_para_empresa" value="Pesquisas com titularidade de patente transferida para empresa" class="myzebra-prime-name-wpcf-ptpte" type="checkbox">
        </div>
        <div class="cred-field cred-field-ptpti">
            <div class="cred-label">Pesquisas com titularidade de patente transferida para inventor</div>
            <input name="wpcf-ptpti" id="ptpti_Pesquisas_com_titularidade_de_patente_transferida_para_inventor" value="Pesquisas com titularidade de patente transferida para inventor" class="myzebra-prime-name-wpcf-ptpti" type="checkbox">
        </div>
        <div class="cred-field cred-field-ptc">
            <div class="cred-label">Pesquisas com tecnologia cedida</div>
            <input name="wpcf-ptc" id="ptc_Pesquisas_com_tecnologia_cedida" value="Pesquisas com tecnologia cedida" class="myzebra-prime-name-wpcf-ptc" type="checkbox">
        </div>
        <div class="cred-field cred-field-psnl">
            <div class="cred-label">Pesquisas com segredo de negócio licenciado</div>
            <input name="wpcf-psnl" id="psnl_Pesquisas_com_segredo_de_negócio_licenciado" value="Pesquisas com segredo de negócio licenciado" class="myzebra-prime-name-wpcf-psnl" type="checkbox">
        </div>
        <div class="cred-field cred-field-pcc">
            <div class="cred-label">Pesquisas com contrato cancelado</div>
            <input name="wpcf-pcc" id="pcc_Pesquisas_com_contrato_cancelado" value="Pesquisas com contrato cancelado" class="myzebra-prime-name-wpcf-pcc" type="checkbox">
        </div>
        <div class="cred-field cred-field-pe">
            <div class="cred-label">Processos encerrados</div>
            <input name="wpcf-pe" id="pe_Processos_encerrados" value="Processos encerrados" class="myzebra-prime-name-wpcf-pe" type="checkbox">
    </div>

Thank you!

What do you mean by "cancels"? Please describe the desired behaviour and the actual behaviour more clearly. Note that neither function needs the big if/else structure, you can say .prop("disabled", this.checked); for each item rather than trying to use .prop("disabled", "true"); and .removeProp("disabled"). If you could find a way to select all of the related items at once (e.g., by giving them a common class) you could reduce each function to a single line with $("input.someClass").prop("disabled",this.checked);. — nnnnnn
– nnnnnn, Commented Jul 17, 2013 at 12:33

ic3b3rg · Accepted Answer · 2013-07-17 12:45:18Z

2

Part of the problem is that you shouldn't fire the pspitlp logic initially. Also, you were using prop instead of attr. Additionally, all that logic can be simplified a great deal:

$(document).ready(function(){

    $("input[name='wpcf-pde']").change(function() {

         $("input[name^='wpcf']").not("[name=wpcf-pcb],[name=wpcf-pde]").attr("disabled", $(this).is(':checked'));

    }).change();

    $("input[name='wpcf-pspitlp']").change(function() {

         $("input[name^='wpcf']").not("[name=wpcf-pcb],[name=wpcf-pspitlp]").attr("disabled", $(this).is(':checked'));

    });

});

answered Jul 17, 2013 at 12:45

ic3b3rg

15k4 gold badges33 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Stano · Accepted Answer · 2013-07-17 13:26:49Z

0

If you want to disable (or uncheck) all but currently selected checkbox, you can use this algorithm:

$(document).ready(function () {
    var inputs = $("div.cred-field input[name^=wpcf]").filter(function () {
        return !(this.name == 'wpcf-pcb' || this.name == 'wpcf-pe'); //skip these two
    });
    inputs.change(function () {
        var c = this.checked;
        inputs.each(function () {
            this.checked = false; // to clear all other checkboxes
            this.disabled = c; // to disable or enable all other checkboxes
        });
        this.checked = c;
        this.disabled = false;
    });
});

http://jsfiddle.net/JJ8Jc/91/

answered Jul 17, 2013 at 13:26

Stano

8,9796 gold badges33 silver badges46 bronze badges

Collectives™ on Stack Overflow

Logic error JavaScript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related