1. #1
    Touch Premium Member
    Join Date
    Jun 2010
    Posts
    324
    Vote Rating
    2
    profunctional is on a distinguished road

      0  

    Default How do place button outside of the form panel?

    How do place button outside of the form panel?


    I have tried to create an Ext.Panel, and add my formpanel and button as items to it, hoping that the login button would appear outside of the form. I've attached a screenshot of the problem.

    I just want the button to be outside of the forms border for a more traditional look. Please advise.

    Thanks!
    Attached Images

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Location
    Haarlem, Netherlands
    Posts
    1,243
    Vote Rating
    10
    TommyMaintz will become famous soon enough TommyMaintz will become famous soon enough

      0  

    Default


    Could you provide us with some source code? From the screenshot it is hard to see how you have set up the panel.

  3. #3
    Touch Premium Member
    Join Date
    Jun 2010
    Posts
    324
    Vote Rating
    2
    profunctional is on a distinguished road

      0  

    Default


    Here is the code for the form panel:

    Code:
            var loginForm = new Ext.form.FormPanel({
                items: [{
                    xtype: 'fieldset',
                    title: 'Login',
                    items: [
                        {
                            xtype: 'textfield',
                            placeholder: 'Username',
                            name: 'UserName',
                            value: 'vincent@test.com',
                            required: true
                        }, {
                            xtype: 'passwordfield',
                            placeholder: 'Password',
                            name: 'Password',
                            value: 'password55',
                            required: true
                        }, {
                            xtype: 'checkbox',
                            name: 'RememberMe',
                            label: 'Save login?',
                            style: 'white-space:nowrap'
                        },
                        loginButton
                    ]
                }]
            });
    the button code:

    Code:
            
    
    var loginButton = new Ext.Button({
                text: 'Login',
                ui: 'action',
                style: 'margin:2%;',
                handler: function() {
                    Ext.getBody().mask(false, '<div class="demos-loading">Loading&hellip;</div>');
                    Ext.Ajax.request({
                        url: loginAction,
                        method: 'post',
                        params: loginForm.getValues(),
                        success: function(response, opts) {
                            x = Ext.decode(response.responseText);
    
                            if (x.errorMessage != null)
                                alert(x.errorMessage);
                            else {
                                mainPanel.setCard(dashboard, 'slide');
                            }
    
                            Ext.getBody().unmask();
                        }
                    });
                }
            });
    I just want the button placed outside the borders of the form. Thanks again.

Similar Threads

  1. Replies: 3
    Last Post: 3 Mar 2010, 7:05 PM
  2. [CLOSED]How would I place the button on the left in a Panel
    By nairep in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 3 Mar 2010, 6:59 PM
  3. Using Ext.Button in place of html submit/button
    By rwankar in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 6 Feb 2008, 3:35 AM
  4. how to place my button into a form
    By kernings in forum Ext 1.x: Help & Discussion
    Replies: 3
    Last Post: 31 Jul 2007, 3:46 AM
  5. how to place a button on the right of a toolbar
    By tangmaosheng2003 in forum Ext 1.x: Help & Discussion
    Replies: 13
    Last Post: 17 Jul 2007, 12:26 PM

Thread Participants: 1