The checkbox blues/looping listeners

The checkbox blues/looping listeners

Hi everyone,

I have a quandary of sorts here dealing with a list of checkboxes and the hiding/showing of a few divs associated with the checkbox selection. Here's basically what I need to do: Hide the lower div if no checkbox is selected. If any one of the first 6 checkboxes are selected, and NOT any of the remaining 6, then show the div. If at any time during selection one of the remaining 6 checkboxes are selected, then hide the associated div. Note this code doesn't really do much. I'm still trying to architect a solution that's best.

  1. var aThroughf = false;
        var gThroughl = false;
        ($('[name="'+q2030.name+'"]')).live('click', function() {
            if (($('[name="'+q2010.name+'"]:checked').length))
        //($('[name="'+q2030.name+'"]:checked'))
            $.each($('[name="'+q2030.name+'"]:checked') , function () {
                console.log($(this).val()+" "+q2030.value);
                if ( ($(this).val() == q2030.value[0]) || ($(this).val() == q2030.value[1]) ||
                         ($(this).val() == q2030.value[2]) || ($(this).val() == q2030.value[3]) ||
                         ($(this).val() == q2030.value[4]) || ($(this).val() == q2030.value[5]) ) {
                             aThroughff = true;
                         }
                else if ( ($(this).val() == q2030.value[6]) || ($(this).val() == q2030.value[7]) ||
                         ($(this).val() == q2030.value[8]) || ($(this).val() == q2030.value[9]) ||
                         ($(this).val() == q2030.value[10]) || ($(this).val() == q2030.value[11]) ) {
                             gThroughl = true;
                         }
                console.log("a-f = "+aThroughf+"\ng-l = "+gThroughl);
                if ( (aThroughf) && !(gThroughl) ) $("#"+q2030.eid).parent().show(1);
                else $("#"+q2030.eid).parent().hide(1);
            });
        });






















I've got some wonky logic going on here, and I was hoping I could use some sort of looping structure to add a bunch of listeners to various html elements that are used as this online, multi-page survey is being done.

  1. if (!($('[name="'+q1110.name+'"]').attr('checked'))) $('#'+q110.eid).hide(1, function () { q1110.toggle = false; });
        $('[name="'+q1110.name+'"]').click(function (e) {
            if (($(this).attr('value') == q1110.value) ? $('#'+q110.eid).slideDown(500, function () { q1110.toggle = true; }).slideDown($("#"+q2030.eid).parent()) : $('#_ProposedFundingDescription').slideUp(500, function () { q1110.toggle = false; }));
        });


  2. $('#'+q2010.eid).css({'width': '1500px', 'float': 'left', 'clear':'both'});
        if ( $('[name="'+q2010.name+'"]').attr('checked') ) $('#'+q2010.eid).hide(1, function () { q2010.toggle = false; });
        $('[name="'+q2010.name+'"]').click(function (e) {
            if ($(this).attr('value') == q2010.value) $('#'+q2010.eid).slideToggle(500, function () { q2010.toggle = true; });
        });



Hoping for some answers,

Eugene "Eggers"