0

I have the following problem. When I press the Add New Feed button in the feeds.js folder, which should call the onNewFeed function (located in the MainController.js file), an error appears in the console:

Unrecognized alias: widget.feedform

When I add MainController.js in the file requires:['FeedViewer.view.main.FeedForm'] the console displays:

[Ext.Loader] error Some requested files failed to load.

Folder structure:

//FeedViewer
    //app
        //view
           //main
               /MainController.js
               /MainModel.js
    //classic
    //modern
        //src
            //view
                //main
                    /FeedForm.js
                    /Feeds.js
                    /Main.js

MainController.js

Ext.define('FeedViewer.view.main.MainController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.main',

    onNewFeed: function () {
        var navView = this.getView(),
            form = navView.child('feedform');

        if (!form) {
            navView.push({
                xtype: 'feedform',
                reference: 'feedform'
            });
        } else {
            navView.setActiveItem(form);
        }
    }
});

FeedForm.js

Ext.define('FeedViewer.view.main.FeedForm', {
    extend: 'Ext.form.Panel',
    xtype: 'feedform',

    requires: [
        'Ext.Button',
        'Ext.field.Select',
        'Ext.form.FieldSet',
        'Ext.Toolbar'
    ],

    title: 'New RSS Feed',

    items: [{
        xtype: 'fieldset',
        items: [{
            xtype: 'selectfield',
            label: 'Select a new feed',
            labelAlign: 'top',
            allowBlank: false,
            name: 'feedUrl',
            options: [{
                value: 'http://rssfeeds.usatoday.com/usatoday-NewsTopStories', 
                text: 'USA Today Top Stories'
            }, {
                value: 'http://sports.espn.go.com/espn/rss/news', 
                text: 'ESPN Top News'
            }]
        }]
    }, {
        xtype: 'toolbar',
        docked: 'bottom',
        items: [{
            xtype: 'button',
            reference: 'savebutton',
            action: 'save',
            ui: 'action',
            text: 'Add'
        }]
    }]
}); 

Feeds.js

Ext.define('FeedViewer.view.main.Feeds', {
    extend: 'Ext.grid.Grid',

    xtype: 'feedslist',

    requires: [
        'ContactsApp.view.feeds.MainController',
        'ContactsApp.view.feeds.MainModel'

    ],

    viewModel: 'feeds',
    controller: 'feeds',

    columns: [{
        dataIndex: 'feed',
        text: 'feed'
    }],

    items: [{
        xtype: 'toolbar',
        docked: 'left',
        items: [{
            xtype: 'button'
            text: 'Add New Feed',
            iconCls: 'fa fa-plus',
            listeners: {
                click: 'onNewFeed'
            }
        }]
    }]
});

Main.js

Ext.define('FeedViewer.view.main.Main', {
    extend: 'Ext.tab.Panel',
    xtype: 'app-main',

    requires: [
        'Ext.window.MessageBox',

        'FeedViewer.view.main.MainController',
        'FeedViewer.view.main.MainModel',
        'FeedViewer.view.main.List'
    ],

    controller: 'main',
    viewModel: 'main',
    layout: 'column',

    items: [{
        xtype: 'feedlist',
        columnWidth: 0.5
    }]
});
Umbro
  • 1,984
  • 12
  • 40
  • 99

1 Answers1

1

Ext tries to load a component on the fly, looks like feedform is not properly registered.


Have u tried adding

alias: 'widget.feedform',

to your FeedForm.js


Panel.js as comparison:

https://docs.sencha.com/extjs/6.2.0/classic/src/Panel.js.html

hwsw
  • 2,596
  • 1
  • 15
  • 19
  • In classic version, everything works. In the modern version, the Main.js file does not look for FeedForm.js and Feeds.js files in the modern folder only in the app folder. I tried to move FeedForm.js and Feeds.j to the app folder, listeners are not working in the Main.js file – Umbro Jul 13 '18 at 20:28