简体   繁体   中英

How do I nest my custom search component inside my home panel?

HI I would like know how do I manage to get:

Ext.define("GS.view.search", {
extend : 'Ext.form.Panel',
xtype : 'fieldsetform',
requires : [ 'Ext.form.FieldSet' ],

config : {
    width : 350,
    pack : 'start',
    align : 'start',
    items : [ {
        xtype : 'fieldset',

        items : [ {
            xtype : 'searchfield',
            name : 'query',
            placeHolder : 'Beneficios, premios o lugares',
            border : 1
        }, {
            xtype : 'searchfield',
            name : 'query',
            placeHolder : 'Beneficios, premios o lugares',
            border : 1
        } ]

    } ]
}
});

inside of the following panel (Ext.create, is not working):

var search = Ext.create("GS.view.search");
Ext.define("GS.view.Home", {
        extend : 'Ext.Panel',
        xtype : "panelhome",
        fullscreen : true,
        layout : 'vbox',
        requires : ['GS.view.search'],

        config : {
            title : 'Home',
            iconCls : 'home',
            cls : 'home',
            scrollable : true,
            stylehtmlContent : true,
            contentEl:'searchid',

            items : [{
                        xtype : 'panel',
                        width : '100%',
                        flex : 1,
                        style : 'background-color: #FFFFF',
                        layout : 'hbox',
                        items : [search]
                    }]
        }
    }); 

Thank you very much for any help you can provide.

Goooooot it!

Ext.define("GS.view.search", {
extend : 'Ext.Panel',
id : 'searchid',
alias: "widget.search",

requires : [ 'Ext.form.FieldSet' ],

config : {
    width : 350,
    pack : 'start',
    align : 'start',
    items : [ {
        xtype : 'fieldset',

        items : [ {
            xtype : 'searchfield',
            name : 'query',
            placeHolder : 'Beneficios, premios o lugares',
            border : 1
        }, {
            xtype : 'searchfield',
            name : 'query',
            placeHolder : 'Beneficios, premios o lugares',
            border : 1
        } ]

    } ]
}
});

var search = new Ext.create('GS.view.search');

Ext.define("GS.view.Home", {
extend : 'Ext.form.Panel',
xtype : "panelhome",
fullscreen : true,
layout : 'vbox',
requires : ['GS.view.search'],

config : {
    title : 'Home',
    iconCls : 'home',
    cls : 'home',
    scrollable : true,
    stylehtmlContent : true,

    items : [{
        xtype : 'panel',
        width : '100%',
        flex : 1,
        style : 'background-color: #FFFFF',
        layout : 'hbox',
        items : [search]
        }]
}
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM