Building a YUI component from a tree and a datatable

Question

I want to build a component that is composed of a treeview and a datatable, in a layout similar to the Windows Open Dialog.

I am using a custom treeview and a custom datatable, derived from YUI's own, but I know they work because they work on their own (and they only perform configurations and add custom events).

I tried various ways, but I am stuck: it doesn't render anything. Here's my code:

DCM.ContentSelector = function(el, oConfigs){
 YAHOO.log('DCM.ContentSelector()');
 var element = YAHOO.util.Dom.get(el);
    DCM.ContentSelector.superclass.constructor.call(this, element, oConfigs);
    // this.createEvent('contentSelectedEvent');
    YAHOO.log('DCM.ContentSelector() end');
}

YAHOO.extend(DCM.ContentSelector, YAHOO.util.Element, {
    initAttributes: function(oConfigs){
  YAHOO.log('initAttributes()');
        DCM.ContentSelector.superclass.initAttributes.call(this, oConfigs);

        var container = this.get('element');

        this.setAttributeConfig('tree', {
            readOnly: true,
            value: new DCM.ContentTreeView(document.createElement('div'))
        });

        this.setAttributeConfig('grid', {
            readOnly: true,
            value: new DCM.ContentTreeView(document.createElement('div'), { width: "100%", height: "100%" })
        });

  this.setAttributeConfig('width', {
      value: oConfigs.width || 400
  });
  this.setAttributeConfig('height', {
      value: oConfigs.height || 300
  });
  YAHOO.log('initAttributes() end');  
    },
    render: function(){
  YAHOO.log('render()');

  var Dom = YAHOO.util.Dom;
        var layout = new YAHOO.widget.Layout(this.get('element'), {
   width: this.width,
   height: this.height,
            units: [{
                position: 'left',
                width: this.width * 0.33,
                scroll: true,
    body: this.tree.getEl()
            }, {
                position: 'center',
    body: this.grid.getContainerEl()
            }]

        });
        layout.render();
  YAHOO.log('render() end');
    }
});

Here's YUI log (on Safari):

INFO 220ms (+0) 9:30:26 GMT+02:00: global: render() end
INFO 220ms (+1) 9:30:26 GMT+02:00: global: render()
INFO 219ms (+0) 9:30:26 GMT+02:00: global: DCM.ContentSelector() end
ERRO 219ms (+0) 9:30:26 GMT+02:00: Attribute: setValue element, ctrl failed: read only
INFO 219ms (+1) 9:30:26 GMT+02:00: global: initAttributes() end
INFO 218ms (+0) 9:30:26 GMT+02:00: global: initAttributes()
ERRO 218ms (+1) 9:30:26 GMT+02:00: AttributeProvider: element not found
INFO 217ms (+0) 9:30:26 GMT+02:00: global: DCM.ContentSelector()
INFO 217ms (+6) 9:30:26 GMT+02:00: LogReader  instance0: LogReader initialized
INFO 211ms (+211) 9:30:26 GMT+02:00: global: id is not a string, assuming it is an HTMLElement
INFO 0ms (+-1413) 9:30:26 GMT+02:00: global: Logger initialized

Here's the components' code, just in case:

var DCM = YAHOO.namespace('DCM');

DCM.base_url = '/path/to/portal';

/**
 * @param {HTMLElement|string} id  HTMLElement or its id
 */
DCM.ContentTreeView = function(id){
    DCM.ContentTreeView.superclass.constructor.call(this, id, {
        label: 'Site',
        url: '',
        expanded: true
    });
    this.setDynamicLoad(this._loadNodes);
}

YAHOO.extend(DCM.ContentTreeView, YAHOO.widget.TreeView, {
    _loadNodes: function(node, onComplete){
        var url = DCM.base_url + '/portal_editor/listTreeNodes';
        if (!node.isRoot()) {
            url += '?path=' + encodeURI(node.data.url);
        }
        var callback = {
            success: function(o){
                var data = YAHOO.lang.JSON.parse(o.responseText);
                var parent = o.argument.node;
                if (data.length == 0) {
                    parent.isLeaf = true;
                }
                else {
                    for (var i = 0; i < data.length; i++) {
                        var d = data[i];
                        if (d.mostraLinkInSidebar) {
                            labelStyle = 'ygtvlabel dcm-hidden-in-sidebar';
                        }
                        else {
                            labelStyle = 'ygtvlabel';
                        }
                        var n = new YAHOO.widget.TextNode({
                            label: d.title,
                            url: d.url,
                            expanded: false,
                            labelStyle: labelStyle
                        }, parent);
                    }
                }
                o.argument.complete();
            },
            failure: function(o){
                YAHOO.log('Cannot load children of node "' + o.node.data.url + '"', 'error', 'DCM.ContentTreeView');
                o.argument.complete();
            },
            argument: {
                node: node,
                complete: onComplete
            }
        };
        YAHOO.util.Connect.asyncRequest('GET', url, callback);
    }
});

/**
 * @param {HTMLElement|string} id  HTMLElement or its id
 * @param {Object} userConfig   config
 */
DCM.ContentTable = function(id, userConfig){
    var column_defs = [{
        key: 'title',
        label: 'Title',
        width: 200,
        sortable: true
    }, {
        key: 'mod_date',
        label: 'Mod. Date',
        formatter: 'date',
        width: 60
    }, {
        key: 'id',
        label: 'ID',
        width: 100
    }, {
        key: 'portal_type',
        label: 'Type',
        width: 150
    }, ];

    var table_source = new YAHOO.util.DataSource(DCM.base_url + '/portal_editor/listFolderContents?');
    table_source.responseType = YAHOO.util.DataSource.TYPE_JSON;
    table_source.connXhrMode = "queueRequests";
    table_source.responseSchema = {
        resultsList: 'items',
        fields: ['title', 'id', 'url', 'portal_type', 'mod_date', 'icon']
    };

    var config = {
        initialRequest: 'path=' + encodeURI(userConfig.path || ""),
        selectionMode: "single"
    };

    YAHOO.lang.augmentObject(config, userConfig);

    DCM.ContentTable.superclass.constructor.call(this, id, column_defs, table_source, config);

    this.table_source = table_source;


    this.subscribe("rowClickEvent", this.onEventSelectRow);

    this.setPath(config.path || '');
}

YAHOO.extend(DCM.ContentTable, YAHOO.widget.ScrollingDataTable, {
    setPath: function(newPath){
        var callback = {
            success: this.onDataReturnReplaceRows,
            failure: this.onDataReturnReplaceRows,
            scope: this,
            argument: this.getState()
        };

        this.table_source.sendRequest('path=' + encodeURI(newPath), callback);
    }
});

Can you help me?