0

我有一个登录屏幕，其中有一个带有两个按钮登录和重置的 ExtJs 表单面板。现在，我正在尝试在 lofin 面板下方添加另一个按钮，以便新用户注册。但是按钮会出现在屏幕底部，并且会出现一个滚动条，使页面看起来很丑！

我的 login.jsp 文件中有这些：

<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all-access.css">   
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script type="text/javascript" src="js/app.js"></script>

这是我的 app.js 文件：

Ext.onReady(function(){
    Ext.QuickTips.init();
    var login = new Ext.FormPanel({
        labelWidth:100,
        frame:true,
        title:'Member Login',
        defaultType:'textfield',
        monitorValid:true,

        // Specific attributes for the text fields for username / password. 
        // The "name" attribute defines the name of variables sent to the server.
        items:[{
            fieldLabel:'Username',
            name:'loginUsername',
            allowBlank:false
        },{
            fieldLabel:'Password',
            name:'loginPassword',
            inputType:'password',
            allowBlank:false
        }],

        buttons: [{    
            text: 'New User Register',
            scale: 'medium',
            handler: function()
            {        
                login.getForm().doAction('standardsubmit',{
                    target : '_self',
                    method : 'POST',
                    standardSubmit:true,
                    formBind: false,
                    url: 'registration.jsp'
                })
            }
        },{
            text: 'Login',
            scale: 'medium',
            handler: function()
            {
                login.getForm().doAction('standardsubmit',{
                    target : '_self',
                    method : 'POST',
                    standardSubmit:true,
                    formBind: true,
                    url: 'index.jsp'
                })
            }
        },{
            text: 'Reset',
            scale: 'medium',
            handler: function(){
                login.getForm().reset();
            }
        }]
    });

    // This just creates a window to wrap the login form. 
    // The login object is passed to the items collection.       
    var win = new Ext.Window({
        layout:'fit',
        width:325,
        height:175,
        closable: false,
        resizable: false,
        plain: true,
        border: false,    

        items: [login]
    });
    win.show();    
});

我尝试Ext.Create在上述按钮的末尾添加一个新按钮，但它不起作用。我尝试将代码放在单独的 js 文件中，并将带有 src 的脚本标签与面板文件一起添加到单独的脚本标签中，即使这样也失败了。

谁能帮我创建一个单独的按钮和我想要的位置？任何形式的帮助表示赞赏。谢谢。

我到处寻找，我已经尽我所能，但我无法想出答案。

注意：代码使问题看起来很长而且很大，但我的主要查询和问题位于问题的顶部和底部。

4

1 回答 1

0

我假设您不想在登录面板内添加新按钮，因为否则您无论如何都可以在按钮列表中添加另一个按钮。要在登录面板下添加按钮并在窗口内添加 YET，请执行以下步骤；

  1. 将表单面板作为项目放入容器中

  2. 在表单面板之后将按钮添加为容器中的第二项

  3. 将容器添加到您的窗口，就像您将面板添加到窗口一样

瞧！你也可以尝试给你的窗口和' id'例如' id=loginWindow'然后调用代码

Ext.getCmp('loginWindow').add(
    {
     xtype:button,
     text:'Yay!'
     }
);

如果您需要更多特定于代码的帮助，请随时给我发消息。我知道你的感觉兄弟<3

于 2014-01-21T11:38:35.863 回答