How can I remember combination states?

I'm having a logic problem with an implementation of combination rules in Javascript.

In short:

• I define which checkboxes cannot be 'on' together with eachother in a JSON object.
• If I click on measure 1 -> measures 7 and 8 get grayed out, this is correct.
• If I click on measure 4 -> measures 8, 9, 10 and 11 get grayed out, this is correct too.
• Now, if I click again on measure 4 -> measure 8 gets active again, but shouldn't be, because the JSON 'rules' state that since measure 1 is still checked, measure 8 must be grayed.

What's a smart way to solve this logic problem? Thanks in advance!

Basically, how do I remember that clicking 'measure 1' already disabled 'measure 8', 开发者_开发百科so that toggling 'measure 4' won't accidentally re-enable 'measure 8' with 'measure 1' still 'on'?

All code here: https://gist.github.com/1055968

Interactive: http://jsfiddle.net/gnijholt/58zuR/

Well logically i'd do something like this:

• when you tick a checkbox, you create an object which stores the rules that are applied.
• when i untick a checkbox, i will remove that rule from the memory object and before unticking each checkboxes i'll go through the memory object to see if there are any conflicting rules. If there is one conflicting rules, i do not gray out the checkbox.

I'm trying to implement this.

EDIT - i'v implemented my idea. here is a fiddle http://jsfiddle.net/Tvs7E/1/

function createObjectsWithRules(rulesApplied){
    var presentBlock = {};
    for (var checkboxid in rulesApplied){
      var presentCombos = rulesApplied[checkboxid];
       for(var key in presentCombos) {
           var obj = presentCombos[key];
           for(var prop in obj) {
              var s = obj[prop];
               presentBlock[s] = true;

           }
       }
    }
    return presentBlock;
}

        $(document).ready(function() {
            var rulesApplied= {};
            $('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);
                    rulesApplied[current_cb.id] = combos;
                    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]);
                        }
                    }
                    console.log(rulesApplied);
                    return;
                }
                // toggle off
                console.log("You ticked off " + current_cb.id);
                combos = JSONSelect.match("." + current_cb.id, combinations);
                console.log(combos);
                delete rulesApplied[current_cb.id];
                console.log(rulesApplied);
                presentRules = createObjectsWithRules(rulesApplied);
                console.log(presentRules);

                for(var key in combos) {
                    var obj = combos[key];
                    for(var prop in obj) {
                        var s = obj[prop];
                        if (!presentRules[s]){
                          $('#' + s).removeAttr('disabled');
                          console.log("I enable " + obj[prop]);
                        }          
                    }
                }
                return;
            });
        });

Try changing your .change event to this

http://paste.pocoo.org/show/424704/

It does what it did before, only without using empty returns to emulate an if-else.

Then when it is done with the clicked input, it loops through all the input to "re-disable" whatever needs to be disabled.

Only tested it lightly

And I can see that while I was writing this, davin was making the same suggestion in the comments. It's the same thing, just with a code example.