D3 Examples - Javascript Combinations problem

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <title>Checkbox Combo Spike</title>
        <style>
            body{
                font-family: 'Helvetica';
                font-size: .8em;
            }
        </style>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.1.4/underscore-min.js"></script>
        <script src="jsonselect.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" charset="utf-8">
            var combinations = [{
                cb1: [['cb7'], ['cb8']]
            },
            {
                cb2: [['cb1']]
            },
            {
                cb3: [['cb4']]
            },
            {
                cb4: [['cb8'], ['cb9'], ['cb10'], ['cb11']]
            },
            {
                cb6: [['cb7']]
            },
            {
                cb7: [['cb6']]
            },
            {
                cb11: [['cb2']]
            }];
        
            $(document).ready(function() {
                $('input').change(function() {
                    current_cb = this;
                    if ($(this).attr("checked")) {
                    // toggle on
                        console.log("You ticked on " + current_cb.id);
                        combos = JSONSelect.match("." + current_cb.id, combinations);
                        for(var key in combos) {
                            var obj = combos[key];
                            for(var prop in obj) {
                                var s = obj[prop];
                                $('#' + s).attr('disabled', 'disabled');
                                console.log("I disable " + obj[prop]);
                            }
                        }
                        return;
                    }
                    // toggle off
                    console.log("You ticked off " + current_cb.id);
                    combos = JSONSelect.match("." + current_cb.id, combinations);
                    console.log(combos);
                    
                    for(var key in combos) {
                        var obj = combos[key];
                        for(var prop in obj) {
                            var s = obj[prop];
                            $('#' + s).removeAttr('disabled');
                            console.log("I enable " + obj[prop]);
                        }
                    }
                    return;
                });
            });
        </script>
    </head>
    
    <body>
        <h2>Demo: Disallowed Combinations of Checkboxes</h2>
​
        <p><strong>Measure 1</strong> cannot be on at the same time as <strong>measure 7</strong> and <strong>8</strong>.</p>
        <p><strong>Measure 2</strong> cannot combine with <strong>measure 1</strong>.</p>
        <p><strong>Measure 3</strong> cannot combine with <strong>measure 4</strong>.</p>
        <p><strong>Measure 4</strong> cannot combine with <strong>measure 8</strong>, <strong>9</strong>, <strong>10</strong> and <strong>11</strong>.</p>
        <p><strong>Measure 11</strong> cannot combine with <strong>measure 2</strong>.</p>
​
        <hr size="0" noshade />
​
        <p><input type="checkbox" name="measure" id="cb1">&nbsp;<label for="cb1">Measure 1</label></p>
        <p><input type="checkbox" name="measure" id="cb2">&nbsp;<label for="cb2">Measure 2</label></p>
        <p><input type="checkbox" name="measure" id="cb3">&nbsp;<label for="cb3">Measure 3</label></p>
        <p><input type="checkbox" name="measure" id="cb4">&nbsp;<label for="cb4">Measure 4</label></p>
        <p><input type="checkbox" name="measure" id="cb5">&nbsp;<label for="cb5">Measure 5</label></p>
        <p><input type="checkbox" name="measure" id="cb6">&nbsp;<label for="cb6">Measure 6</label></p>
        <p><input type="checkbox" name="measure" id="cb7">&nbsp;<label for="cb7">Measure 7</label></p>
        <p><input type="checkbox" name="measure" id="cb8">&nbsp;<label for="cb8">Measure 8</label></p>
        <p><input type="checkbox" name="measure" id="cb9">&nbsp;<label for="cb9">Measure 9</label></p>
        <p><input type="checkbox" name="measure" id="cb10">&nbsp;<label for="cb10">Measure 10</label></p>
        <p><input type="checkbox" name="measure" id="cb11">&nbsp;<label for="cb11">Measure 11</label></p>
    </body>
</html>
    