SelectMultipleField WTForm not being checked properly with javascript, why?

I have a WTForm with a SelectMultipleField set up as a checkbox list. I have some javascript for mandatory inheritance of some options (i.e. selecting D automatically selects C as well and won't let you unselect it until D is unselected. However, the code I have below isn't working properly as the inherited selections aren't being passed in the form data and therefore aren't displayed when refreshed.

class Item_Form(Form):
    id = HiddenField('id', [])
    title = TextAreaField('title', [required()])
    categories = SelectMultipleField('categories', choices = checkboxes(),
    option_widget = widgets.CheckboxInput(), widget = widgets.ListWidget(prefix_label = False))
    parent_id = HiddenField('parent_id', [])

<div class = "half">
    {{ form.categories() }}
</div>

function inherit_checkboxes(element) {
    var level = parseInt($(element).parent().attr("class").substr(-1));
    if (level) {
        var parent = $(element).parent().prevAll("li.left-" + (level - 1) + ":first").children()[0];
        // Checking.
        if (element.checked) {
            // Disable and check parent and recurse.
            $(parent).prop("checked", true);
            $(parent).attr("disabled", true);
            inherit_checkboxes(parent);
        }
        // Unckecking.
        else {
            // Uncheck self and enable parent if no checked siblings.
            $(element).prop("checked", false);
            var siblings = $(parent).parent().nextUntil("li.left-" + (level - 1));
            var checked_siblings = siblings.filter("li.left-" + level).find("input:checked");
            if (!checked_siblings.length) {
                $(parent).attr("disabled", false);
            }
        }
    }   
}

The code modifies the correct checkboxes to display as disabled and checked as in the image, but they still don't count properly when the form is passed, why?

Categories