Question 382676 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – ExtJS multiple child applications inside primary

I’m trying to use multiple Applications inside one parent Application.

Here is example fiddle like this:

Ext.application({
    name : 'Parent app',
    launch : function() {

        Ext.application({
            name: 'ChildApp1',
            sayHello: function(){
                console.log('ChildApp 1');
            }
        });

        Ext.application({
            name: 'ChildApp2',
            sayHello: function(){
                console.log('ChildApp 2');
            }
        });

But when I’m trying to interact between apps, it seems that last App rewrites whole primary namespace.

I am trying to dynamically access a specific App, but I get only the App created last.

const appName = 'ChildApp1';
Ext.app.Application.instance.getApplication(appName).sayHello(); // calls ChildApp2 method

How is it possible to dynamicly call (I don’t know app name in advance) multiple applications methods from each other ?

Am I right with classes architecture/definition or not?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I managed to figure out this issue by rewriting Ext.application to class definitions extending Ext.app.Application like this:

    Ext.application({
    name : 'Parent app',
    launch : function() {

        Ext.define('ChildApp1', {
            extend: 'Ext.app.Application',
            name: 'ChildApp1',
            sayHello: function() {
                console.log('ChildApp 1');
            }
        });

    Now you can call various apps methods like this:

     const app1 = Ext.create('ChildApp1');
 app1.sayHello();

    Here is fiddle.

    Also you can read some interesting information in old sencha forum thread.


  2. 0

    From what I see in your fiddle you could use a workspace with packages. It does not look like you are really using 2 Ext Applications. Unfortunately fiddle does not support custom packages.

    Create a workspace

    https://docs.sencha.com/cmd/7.7.0/guides/workspaces.html

    sencha generate workspace /path/to/workspace

    Create a Package

    With a workspace you can add packages:
    https://docs.sencha.com/cmd/7.7.0/guides/cmd_packages/cmd_packages.html

    sencha generate package common

    Dynamic Package Loading

    With packages you can use dynamic package loading:
    https://docs.sencha.com/cmd/7.7.0/guides/dynamic_package_loading.html

    Explanation

    A package can be a supplier of functionality, views, data, …
    A package can be build just like an application, but you can bundle or import it with your main application.

    Example Usecase

    1. A workspace can hold several apps and packages. If you have several applications you can add your overrides into a base package, and require it for all your apps. This basically loads functionality.
    2. If you build a dashboard and only want to load a certain part from the beginning, you can use packages to load them on the fly with the part of the application, you need on button press in the dashboard. This basically loads additional views on the fly.
    3. A theme package overrides a given theme.
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search