ExtJS 6 configure Ext.ux

I'm trying to use the color picker under ext/packages/ux/classic/src/colorpicker So I set my requires :

requires: [
        'Ext.plugin.Viewport',
        'Ext.window.MessageBox',


        'ThemeDemoApp.view.main.MainController',
        'ThemeDemoApp.view.main.MainModel',
        'ThemeDemoApp.view.main.List',
        'Ext.slider.Single',
        'Ext.ux.colorpick.Button'
    ]

And at the top of app.js, I set this :

Ext.Loader.setConfig({                enabled : true,
                paths   : {
                        'Ext.ux' : 'ext/packages/ux/classic/src'
                } 
        });

But it's not working I have : Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:1841/ext/classic/cl...=1437726506841

It doesn't take my loader configuration. How can I configure Ext.ux correctly ?

Thanks

Answers:

Answer

Make sure that your app.json requires ux:

"requires": [
    // ...
    "ux"
]

Also, as you are using Sencha CMD there is no need to worry about Ext.Loader.

Answer

This is how i configured my web application that uses Ext.ux. Take a look: enter image description here

As you can see i added ext-ux folder with all interested for me sources inside webapp. In app.js i added:

Ext.Loader.setPath('Ext.ux', 'extjs/ext-ux/src/ux');

In index.jsp i added:

<head>
    <script type="text/javascript" src="extjs/ext-all-debug.js"></script>
    <script type="text/javascript" src="extjs/ext-ux/ext-ux-debug.js"></script>
    <script type="text/javascript" src="app.js"></script>
</head>

Of course paths will change depends on your configuration.

And example to show how to use it:

Ext.define('ScuWeb.ScuWebApp', {
    extend: 'Ext.ux.desktop.App',

    requires: [
        'Ext.window.MessageBox',
        'Ext.ux.desktop.ShortcutModel'
    ],
Answer

With EXT Js, using Sencha CMD, adding requires [...,"ux"] is sufficient.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.