Импорт FiltersFeature для ExtJS в jsFiddle

Я хотел бы иметь работающую демонстрацию ExtJS, используя Ext.ux.grid.FiltersFeature в jsFiddle. Я не смог понять, как это делается.

Я попробовал это:

Ext.Loader.setConfig({enabled: true});
Ext.Loader.setPath('Ext.ux', 'js/lib/ext-4.2.1.883/ux');

Ext.require([
    'Ext.data.*',
    'Ext.data.reader.*',
    'Ext.grid.*',
    'Ext.tree.*',
    'Ext.ux.grid.FiltersFeature',    
    'Ext.util.*',
    'Ext.state.*']);

Но это не работает.

Я также попытался добавить этот URL в качестве внешнего ресурса:

http://docs.sencha.com/extjs/4.1.1/source/FiltersFeature.html

Но jsFiddle падает в первой строке, потому что он не ожидает HTML.

Я также пытался импортировать FiltersFeature в Sencha Fiddle, но это тоже не работает.

Вот моя текущая попытка jsFiddle, а также попытка Sencha Fiddle. Мне не повезло ни с одним из них.

1 ответ

Решение

Вам просто нужно несколько настроек, чтобы заставить его работать. Во-первых, вы можете настроить свой Ext.Loader Конфигурация пути для извлечения непосредственно из CDN ExtJS:

Ext.Loader.setPath('Ext.ux', 'http://cdn.sencha.com/ext/gpl/4.2.0/examples/ux/');

Затем вам нужно обернуть свой экземпляр кода в Ext.onReady() чтобы предотвратить его выполнение до FiltersFeature класс загружен:

Ext.onReady(function() {
    var v1 = Ext.create('myGrid', {
        myGridId: 'myGrid1'
    });

    Ext.create('Ext.tab.Panel', {
        renderTo: document.body,
        items: [v1]
    });
});

При желании, чтобы значки меню фильтров отображались правильно, вы также можете добавить необходимые CSS-файлы, связанные с фильтром, в качестве внешних ресурсов:

Сделав это, конечный результат - это скрипка, которая отлично работает через несколько секунд для загрузки внешнего класса.

Другие вопросы по тегам