Как правильно настроить узлы дерева дерева JS?

Ext JS 4. У меня есть tree.Panel, где я хочу отображать пользовательский HTML в каждом узле, сгенерированном из данных модели этого узла. Я могу это сделать, установив text узла при загрузке магазина, но это не задача модели делать разметку. Поэтому я создал пользовательский номер Column, который отображает мой HTML.Как правильно настроить узлы дерева дерева JS?

Моя проблема: если я не получаю от Ext.tree.Column, она не отображается правильно (никаких набросков, плюс/минус и т. Д.). Если да, то все в порядке, но Ext.tree.Column помечено как личное для Ext JS.

Есть ли официально поддерживаемый API для выполнения того, что я хочу?

источник

2011-12-29 Vasiliy Faronov

я написал в блоге о том, как настроить ExtJS 4 дерева панели, я надеюсь, что это поможет: http://hardtouse.com/blog/?p=24

Идея заключается в том, чтобы использовать средства визуализации в сочетании с большим количеством CSS магия:

columns : [{ 
    xtype : 'treecolumn', 
    dataIndex : 'name', 
    renderer : function(value, record){ 
     return Ext.String.format('<div class="tree-font">{0}</div>', value); 
    }]

источник

2011-12-29 20:41:09 Chao

Вы также используете «treecolumn». Вот о чем мой вопрос. –

Я вижу. Ну, ExtJS 4 TreeGrid Demo использует «treecolumn», поэтому я решил, что нам тоже должно быть хорошо. вот ссылка: http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/tree/treegrid.js – Chao

Кажется разумным. –

Спасибо за ваш ответ выше. Вот еще один пример, показывающий, еще несколько вариантов форматирования:

columns: [{ 
    xtype: 'treecolumn', 
    dataIndex: 'text', 
    flex: 1, 
    renderer: function (value, metaData, record, rowIndex, colIndex, store, view) { 
     // see http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.tree.Column-cfg-renderer 
     var tooltipString = "Hello"; 
     metaData.tdAttr = 'data-qtip="' + tooltipString + '"'; 
     return Ext.String.format('{0} <span style="color:red;">{1}</span>', value, record.data.personname); 
    } 
}]

Вы также можете добавить

hideHeaders : true,

на дереве панели конфигурации, чтобы удалить «сетки» заголовок, который появляется в результате используя ведомость.

Murray

источник

2013-12-23 06:56:33 Murrah

Как правильно настроить узлы дерева дерева JS?

ответ

Смежные вопросы