Ce code fonctionne dans Extjs 4.0.2a mais une fois converti en 4.1, il ne fonctionne plus et donne une erreur

Uncaught TypeError: Cannot call method 'query' of undefined

Ext.onReady(function() {

    var panel = new Ext.Panel({
        renderTo: divtag,
        draggable: {
            insertProxy: false,
            onDrag: function(e) {
                var el = this.proxy.getEl();
                this.x = el.getLeft(true);
                this.y = el.getTop(true);
            },
            endDrag: function(e) {
                this.panel.setPosition(this.x, this.y);
            }
        },
        title: 'Panel',
        width: 200,
        height: 100,
        x: 20,
        y: 20
    });
});
2
jayesh 19 déc. 2011 à 12:02

3 réponses

Meilleure réponse

Apparemment, il y a un bogue dans cette version d'Ext. Cela ne fonctionnera pas même si vous essayez D'n'D par défaut pour un panneau comme celui-ci:

Ext.onReady(function() {
    var panel = new Ext.Panel({
        renderTo: 'divtag',
        draggable: true,
        title: 'Panel',
        width: 200,
        height:100,
        x: 20,
        y: 20
    }); //panel.show(); });
});

Je pense à patcher le code pour qu'il fonctionne comme vous le souhaitez, ce code devrait fonctionner:

Ext.onReady(function() {
    var panel = new Ext.Panel({
        renderTo: 'divtag',
        draggable: {
            insertProxy: false,
            onDrag: function(e) {
                var el = this.proxy.getEl();
                this.x = el.getX();
                this.y = el.getY();
            },
            endDrag: function(e) {
                panel.setPosition(this.x,this.y);
            },
            alignElWithMouse: function() {
                panel.dd.superclass.superclass.alignElWithMouse.apply(panel.dd, arguments);
                this.proxy.sync();
            }
        },
        title: 'Panel',
        width: 200,
        height:100,
        x: 20,
        y: 20
    }); //panel.show(); });
});

En guise de remarque, je devrais probablement vous conseiller de ne pas le faire de toute façon, car vous pouvez définir votre propre DD pour le panneau que vous pouvez utiliser, et encore mieux Ext en a déjà un défini, vous pouvez donc simplement remplacer le panneau Ext pour utiliser la valeur par défaut Ext.util.ComponentDragger, ou dans code, je vous conseille de faire ceci:

Ext.override(Ext.panel.Panel, {
    initDraggable: function() {
        var me = this,
            ddConfig;

        if (!me.header) {
            me.updateHeader(true);
        }

        if (me.header) {
            ddConfig = Ext.applyIf({
                el: me.el,
                delegate: '#' + me.header.id
            }, me.draggable);

            // Add extra configs if Window is specified to be constrained
            if (me.constrain || me.constrainHeader) {
                ddConfig.constrain = me.constrain;
                ddConfig.constrainDelegate = me.constrainHeader;
                ddConfig.constrainTo = me.constrainTo || me.container;
            }

            me.dd = Ext.create('Ext.util.ComponentDragger', this, ddConfig);
            me.relayEvents(me.dd, ['dragstart', 'drag', 'dragend']);
        }
    }
});
var panel = Ext.create('Ext.panel.Panel', {
    id: 'test',
    renderTo: 'divtag',
    draggable: true,
    floating: true,
    title: 'Panel',
    width: 200,
    height:100,
    x: 20,
    y: 20
});

Le code d'une fonction initDraggable dans la substitution de panneau est tiré de la version stable actuelle de Méthode Ext.window.Window.initDraggable.

3
sbgoran 27 déc. 2011 à 20:12

Juste une suggestion: un composant Window est un panneau spécialisé qui a un mix flottant - pourrait être tout ce dont vous avez besoin.

0
dbrin 22 déc. 2011 à 06:07

J'ai pu le faire fonctionner en 4.1: vous devez ajouter des guillemets autour de l'id de l'élément renderTo, comme:

renderTo : 'divtag',

Sans guillemets, il cherchait une variable non définie nommée divtag.

Une fois que j'ai couru, je n'ai eu aucune erreur, puis j'ai fait panel.show() pour le rendre.

2
JD Smith 21 déc. 2011 à 15:59
8558564