Импорт 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-файлы, связанные с фильтром, в качестве внешних ресурсов:
- http://cdn.sencha.com/ext/gpl/4.2.0/examples/ux/grid/css/GridFilters.css
- http://cdn.sencha.com/ext/gpl/4.2.0/examples/ux/grid/css/RangeMenu.css
Сделав это, конечный результат - это скрипка, которая отлично работает через несколько секунд для загрузки внешнего класса.