Knockout Custom Binding using templates with nested foreach

Question

I have a problem where I have 4 nested lists each inside it's own knockout model. A form has pages. A page has sections. A section has groups. A group has controls. Each level (page, section, group, control) except groups is sortable within it's own level. The problem I'm having is that I'm trying to use custom binding with templates with lists. I need the custom binding to use the template but also I wanted to make the element sortable on in the same binding. I got it sorta working but I lost the context. When I did ko.dataFor on a control element it gave me the Section model, and not the control model i wanted. And the ko.ContextFor $parents array was empty when it should chain back up. I'm using rendertemplateforeach which seems to be in the 2.3 debug version of knockout only. Any help would be appreciated.

I dont know if each level needs it's own binding or it all goes into one big binding function.

Here is the sample code. It's not working 100%. The controls aren't showing up.

---

Sample Code <-- LINK

ko.bindingHandlers.renderSection = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    $(element).sortable({
        handle: '.draggable',
        placeholder: "ui-state-highlight",
        connectWith: ".sectionSortable",
    }).disableSelection();
    return {
        controlsDescendantBindings: true
    };
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    var options = ko.utils.unwrapObservable(valueAccessor())
    return ko.renderTemplateForEach(options.name, options.foreach, {}, element, bindingContext);
}

};