MVC_wrong.jpgold_good.jpgi'm rewriting an existing application into the MVC - format
in the 'old' non-MVC pattern i had a formpanel with the search fields 'framed', having the 'blue' background..
when rewriting the same app but in mvc format, the frame option shows tiny blue borders, and the panel shows a white background (see attached screenshots)
i've already tried tons of possibilities but no luck...
what am i missing ?? i don't see it. can you help me
if have a viewport --> containing the quotescontainer which itself contains the searh-formpanel and a gridpanel
in the 'old' non-MVC pattern i had a formpanel with the search fields 'framed', having the 'blue' background..
when rewriting the same app but in mvc format, the frame option shows tiny blue borders, and the panel shows a white background (see attached screenshots)
i've already tried tons of possibilities but no luck...
what am i missing ?? i don't see it. can you help me
if have a viewport --> containing the quotescontainer which itself contains the searh-formpanel and a gridpanel
Code:
Ext.define('cmqu10r.view.Viewport',{ extend : 'Ext.container.Viewport', requires : [ 'cmqu10r.view.QuotesContainer', 'cmqu10r.view.GridlayoutForm', 'cmqu10r.view.SearchForm' ], initComponent : function(){ Ext.apply(this,{ layout : 'card', items : this.buildItems() }); this.callParent(arguments); }, buildItems : function(){ return [{ xtype : 'container', layout : { type : 'hbox', align : 'stretch' }, items : [{ xtype : 'gridlayoutform', hidden : true, //title: 'GridLayout', flex: 0.4, margin : '10 10 10 10' },{ xtype : 'searchform', hidden : true, title: 'Search', flex: 0.4, margin : '10 10 10 10' }, { xtype : 'quotescontainer', // margin : '10 10 10 0' , margin : '5 5 5 0' , title : "<img border='0' src='/vvresources/icons/calculator.png' />" + " Comaker Quotes", flex : 1 }] }]; } });
Code:
Ext.define('cmqu10r.view.QuotesContainer',{ extend : 'Ext.panel.Panel', alias : 'widget.quotescontainer', requires : [ 'cmqu10r.view.QuoteList', 'cmqu10r.view.SearchList', ], initComponent : function(){ Ext.apply(this,{ layout: 'border', // tbar : this.buildTbar(), items : this.buildItems() }); this.callParent(arguments); }, buildItems : function(){ return [ { xtype: 'searchlist', region : 'north' }, { xtype: 'quotelist', region : 'center' }]; }, buildTbar : function(){ return [ { text : 'Save layout', iconCls : 'book_add', itemId : 'savgrlayoutbutton' }, { text : 'Get layout', iconCls : 'book_go', itemId : 'getgrlayoutbutton' },'->', { text: 'view', iconCls : 'control_equalizer_blue', itemId : 'gridlayoutbutton' } ]; } });
Code:
Ext.define('cmqu10r.view.SearchList', { extend: 'Ext.form.FormPanel', alias: 'widget.searchlist', initComponent: function () { Ext.apply(this, { height: 140, minHeight: 90, labelWidth: 100, frame: true, /*tbar : this.buildTbar(),*/ items: this.buildItems3() }); this.callParent(arguments); }, buildItems3: function(){ return [ {layout:'column', defaults:{ columnWidth:0.33 ,layout:'form' ,border:false ,xtype:'panel' ,bodyStyle:'padding:0 18px 0 0'}, items:[ // left column {defaults:{anchor:'80%'}, items:[ {xtype: 'textfield', id:'quotenr', fieldLabel: 'OfferNumber', emptyText:'Typ Offernbr' },{ xtype: 'textfield', id:'accman', fieldLabel: 'Acc.Manager', emptyText:'Typ Acc.Manager' },{ xtype: 'textfield', id:'acceng', fieldLabel: 'Acc.Engineer', emptyText:'Typ Acc.Engineer' },{ xtype: 'textfield', id:'qry', fieldLabel: 'Predefined Filter', width : 60 } ] }, // middle column {defaults:{anchor:'100%'}, labelWidth:100, items:[ {xtype:'textfield', id:'customer', name: 'customer', fieldLabel: 'Customer', emptyText:'Typ Customer(s)', style: 'font-size: 10px;', labelSeparator: '' },{ xtype:'textfield', id:'description', fieldLabel:'Description Part' },{ xtype:'textfield', id:'partnbr', fieldLabel:'Part number' } ] }, //right column {defaults:{anchor:'100%'}, items:[ { xtype: 'textfield', id:'reference', fieldLabel: 'Reference Customer', emptyText:'Reference Customer' },{ xtype: 'textfield', id: 'machine', fieldLabel: 'Machine', emptyText:'Machine Type' },{ xtype: 'textfield', id: 'material', fieldLabel: 'Material', emptyText:'Material' } ] } ] } ] } });
Comment