My components are sliding...

[sencha-dev2]

Hi, I encountered an issue with components part of a fieldset. When I hold the mouse down and move it to the right while a field is focused, it slides on the left. If I bring back the mouse on the left still the same, it ends in appearing again. But if I stop holding the mouse when the fields are gone out of the screen, I can't display it again.

Is it normal, and how can I fix it ?

Thanks in advance for help.

[scottmartin]

Can you duplicate this with any of our online examples? You will need to provide a small working test case if not. There are no reports of this that I am aware of.

Some screens might also be helpful.

Regards,
Scott.

[sencha-dev2]

Hi, I tried with some examples on your website, and I noticed that effectively, on the form examples, the same phenomenon appears, but it is a slight sliding compared to the one I encountered on my own app.

You should try on the 'Shopping card Checkout' example, in the complete checkout one. It's not the only occurrency. I'm using Google Chrome to develop.

Here are some screenshots of what it does on mine : I noticed it seems to happen only when the mouse quits the form zone while it is pressed and focused on one of this form's field.

This is when I come on the component. The field is focused by default, but it also happens when I focus it myself. Then I quit the form window ( also does it with a fieldset ) while holding the mouse down.


It slides a little but I had to take many screenshots, cause the phenomenon's quick. Then it disappears. If you keep holding and go on the other side of the window, it ends in coming back. Else, if you relax it, you can't make it appear again.

Hope you'll be able to figure why it happens. We must reload each time it occurs if we just relax the mouse.

Thanks for your help.

Here's the code of the form window.

Ext.define('Infologis.view.PageConnexion', {
    extend: 'Ext.window.Window',
    alias: 'widget.PageConnexion',
    modal: true,
    width: 300,
    title: 'Connexion',
    id: 'formConnexion',
    border: false,
    closable: false,
    
    initComponent: function() {
        var me = this;
        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'form',
                    layout: {
                        type: 'vbox',
                        align: 'center'
                    },
                    items: [
                        {
                            xtype: 'label',
                            text: 'Le login/le mot de passe est incorrect',
                            hidden: true,
                            id: 'msgErreurConnexion',
                            style: {
                                color: 'red'
                            },
                            padding: 10
                        },
                        {
                            xtype: 'textfield',
                            emptyText: 'Login',
                            regex: /\w{3,12}/i, // controle de la longueur comprise entre 3 et 12 caractères alphanumériques, underscore inclus
                            id: 'loginPageConnexion',
                            maxLength: 12,
                            enforceMaxLength: true,
                            regexText: 'Le login doit avoir une longueur minimale de 3 caracteres',
                            padding: 5
                        },
                        {
                            xtype: 'textfield',
                            emptyText: 'Mot de passe',
                            id: 'mdpPageConnexion',
                            inputType: 'password',
                            enableKeyEvents: true,
                            padding: 5
                        }
                    ]
                }
            ],
            buttons: [
                {
                    name: 'validConnect',
                    text: 'Se connecter',
                    width: 70,
                    height: 20
                }
            ]
        });
        me.callParent(arguments);
    }
});

screenSlide1.jpgscreenSlide2.jpgscreenSlideFinal.jpg

[evant]

It's an issue specific to WebKit, it should be fixed in 4.1.1.

[sencha-dev2]

Thanks for your answer. I'll just have to wait then...