Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha User
    Join Date
    Jan 2013
    Posts
    3
    Vote Rating
    0
    ngjiajun is on a distinguished road

      0  

    Default Answered: centralized EXTJS form panel when minimize and maximize browser?

    Answered: centralized EXTJS form panel when minimize and maximize browser?


    Just wonder issit possible to centralized form panel when minimize and maximize browser.


    therefore, i wonder could the form panel be center when load and during any minimize or maximize or re-sizing of the browser, the form panel will still be center alway.


    my html code are as follow

    HTML Code:
    <html>    <head>        <title>Test</title>        <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />        <script type="text/javascript" src="extjs/ext-all.js"></script>    <script type="text/javascript" src="index2.js"></script>        </head>    <body>    </body>    </html>
    my java scripts are as follow

    Code:
      Ext.require([    
            'Ext.form.*',
            'Ext.tip.*'
        ]);
        
        Ext.onReady(function() {    
            // Helpers
            
            // Very basic bassword validation. 
            // Note that length validation is managed by ExtJs itself --
            // scroll down to see how in the field properties
            Ext.apply(Ext.form.field.VTypes, {
                password: function(val, field) {
                    if (/^[a-z0-9]+$/i.test(val)) {
                        return true;
                    }
                },
                passwordText: 'Password may only contain letters and numbers.'
            });
            
            Ext.QuickTips.init();
            
            function submitOnEnter(field, event) {
                if (event.getKey() == event.ENTER) {
                    var form = field.up('form').getForm();
                    form.submit();
                }
            }
            
            // From http://bit.ly/Bvvv8
            function password(length, special) {
                var iteration = 0;
                var password = '';
                var randomNumber;
        
                if (special == undefined) {
                    var special = false;
                }
        
                while (iteration < length) {
                    randomNumber = (Math.floor((Math.random() * 100)) % 94) + 33;
                    if (!special) {
                        if ((randomNumber >=33) && (randomNumber <=47)) { continue; }
                        if ((randomNumber >=58) && (randomNumber <=64)) { continue; }
                        if ((randomNumber >=91) && (randomNumber <=96)) { continue; }
                        if ((randomNumber >=123) && (randomNumber <=126)) { continue; }
                    }
                    iteration++;
                    password += String.fromCharCode(randomNumber);
                }
                return password;
            }
        
            // Form
            // -----------------------------------------------------------------------
            var addUserForm = Ext.create('Ext.form.Panel', {
                renderTo: Ext.getBody(),
                bodyStyle: 'margin: 0px auto 0px auto;',
                defaults: {
                    xtype: 'textfield',
                    anchor: '100%',
                 },
                items: [{
                    fieldLabel: 'Email',
                    name: 'email',
                    vtype: 'email',
                    maxLength: 64,            
                    allowBlank: false,
                    listeners: {
                        specialkey: submitOnEnter
                    }
                },{
                    xtype: 'fieldcontainer',
                    fieldLabel: 'Password',
                    layout: 'hbox',
                    items: [{
                        xtype: 'textfield',
                        name: 'password',
                        flex: 1,
                        vtype: 'password',
                        minLength: 4,
                        maxLength: 32,
                        allowBlank: false,
                        listeners: {
                            specialkey: submitOnEnter
                        }
                    }, {
                        xtype: 'button',
                        text: 'Random',
                        tooltip: 'Generate a random password',
                        style: 'margin-left: 4px;',
                        flex: 0,
                        handler: function() {
                            this.prev().setValue(password(8, false));
                            this.prev().focus()
                        }
                    }]
                }],
                buttons: [{
                    id: 'saveBtn',
                    itemId: 'saveBtn',
                    text: 'Submit',
                    handler: function() {
                        this.up('form').getForm().submit();
                    }
                },{
                    text: 'Cancel',
                    handler: function() {
                        this.up('form').getForm().reset();
                    }
                }],
                submit: function() {
                    var currentForm = this.owner.form;
                    
                    if (currentForm.isValid()) {
                        // var newSomething = Ext.create('Something', currentForm.getFieldValues());
                    }
                },
                
            });
        });

  2. Since you aren't taking advantage of an Ext.container.Viewport and ExtJs's native layout management, it would probably be simplest to add your login form to an Ext.window.Window and enable auto-centering:

    Remove this from your FormPanel config:

    Code:
    renderTo: Ext.getBody()
    Then do this:

    Code:
        Ext.create('Ext.window.Window', {
            bodyPadding: 5,
            closable: false,
            resizable: false,
            title: 'Login',
            width: 325,
            listeners: {
              afterrender: function(component, eOpts) {
                Ext.EventManager.onWindowResize(component.center, component) 
              },
              beforeclose: function(component, eOpts) { 
                Ext.EventManager.removeResizeListener(component.center, component); 
              }
            },
            items: [addUserForm]
          }).show();

  3. #2
    Sencha - Community Support Team friend's Avatar
    Join Date
    Apr 2011
    Posts
    895
    Answers
    106
    Vote Rating
    27
    friend has a spectacular aura about friend has a spectacular aura about

      0  

    Default


    Since you aren't taking advantage of an Ext.container.Viewport and ExtJs's native layout management, it would probably be simplest to add your login form to an Ext.window.Window and enable auto-centering:

    Remove this from your FormPanel config:

    Code:
    renderTo: Ext.getBody()
    Then do this:

    Code:
        Ext.create('Ext.window.Window', {
            bodyPadding: 5,
            closable: false,
            resizable: false,
            title: 'Login',
            width: 325,
            listeners: {
              afterrender: function(component, eOpts) {
                Ext.EventManager.onWindowResize(component.center, component) 
              },
              beforeclose: function(component, eOpts) { 
                Ext.EventManager.removeResizeListener(component.center, component); 
              }
            },
            items: [addUserForm]
          }).show();

  4. #3
    Sencha User
    Join Date
    Jan 2013
    Posts
    3
    Vote Rating
    0
    ngjiajun is on a distinguished road

      0  

    Default


    thanks alot, it finally work

Thread Participants: 1

Tags for this Thread