JSFiddle - React, Tailwind, and code Playground

by devd

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.1/resources/css/ext-all.css">

JavaScript

var store = Ext.create('Ext.data.TreeStore', {
    root: {
        expanded: true,
        children: [
            { text: "Javascript", leaf: true },
            { text: "ASP.net", leaf: true },
            { text: "Also ASP.net", leaf: false, 
             
                             children: [{
                    
                    text: '1.1 foo',
                    leaf: false,
                    children: [{
                        
                        text: "1.1.1 asp.net mvc",
                        expanded: true
                    }, {
                       
                        text: "1.1.2 java",
                        expanded: true
                    }, {
                      
                        text: "1.1.3 extjs",
                        expanded: true
                    }]
                }, {
                   
                    text: '1.2 bar',
                    leaf: true
                }]
             
            }
        ]
    }
});

Ext.create('Ext.tree.Panel', {
    title: 'Example Tree',
    width: 200,
    height: 450,
    store: store,
    rootVisible: false,
    multiSelect: true,
    renderTo: Ext.getBody(),
    dockedItems: [{
        xtype: 'toolbar',
        dock : 'bottom',
        items : [{
            text: 'Search for ASP.net',
            handler: function(){
                var me = this,
                    panel = me.up('panel'),
                    rn    = panel.getRootNode(),
                    regex = new RegExp("ASP.net");
                
                var c = rn.findChild("text","Also ASP.net",true);
                c.expand();
                console.log(c);
                rn.findChildBy(function(child){
                    var text = child.data.text;
                    if(regex.test(text) === true){
                        console.warn("selecting child", child);
                        panel.getSelectionModel().select(child, true);
                    }
                });
  ...