PDA

View Full Version : GridPanel und Ext.form.TwinTriggerField in tbar



buddy_serg
9 Jul 2009, 6:49 AM
Hello,
I am using the example : http://www.extjs.com/deploy/dev/examples/form/custom.html. I am adding an Ext.ux.SearchField in the tbar of a GridPanel. My source :


App.admin.UserPanel = function(config) {
this.id = 'app-AdminUserPanel';
this.title = App.lang.strUsers;
this.iconCls = 'app-icon-users';
this.loadMask = true;
this.border = false;
// Grid View
this.view = new Ext.grid.GridView({ autoFill: true, enableRowBody: true, forceFit: true, emptyText: App.lang['strNoData'] });
this.sm = new Ext.grid.RowSelectionModel({ singleSelect: true });

// Store
this.store = new Ext.data.JsonStore({
url: App.admin.UserHandler
, id: 'app-AdminUserStore'
, baseParams: { action: 'getAll', dir: 'asc', sort: 'usr_id', limit: App.settings.ListMaxRows }
, remoteSort: true
, root: 'data'
, id: 'usr_id'
, totalProperty: 'total'
, fields: [
'usr_id'
, 'usr_login'
, 'usr_salutation'
, 'usr_title'
, 'usr_email'
, 'usr_alias'
, 'usr_active'
, 'usr_description'
, 'usr_admin'
, { name: 'usr_name', type: 'string', mapping: 'usr_name + ", " + obj.usr_firstname' }
]
})
// ColumnModel
this.cm = new Ext.grid.ColumnModel([
{ header: 'ID', width: 4, dataIndex: 'usr_id', sortable: true, hideable: false }
, { header: App.lang.strActive, width: 4, dataIndex: 'usr_active', sortable: true, renderer: App.renderer.TrueFalse }
, { header: App.lang.strLogin, width: 7, dataIndex: 'usr_login', sortable: true, hideable: false }
, { header: App.lang.strSalutation, width: 7, dataIndex: 'usr_salutation',sortable: true }
, { header: App.lang.strTitle, width: 16, dataIndex: 'usr_title', sortable: true }
, { header: App.lang.strName, width: 24, dataIndex: 'usr_name', sortable: true,
renderer: function(value, p, record) {
p.attr = 'ext:qtip="' + record.data.usr_description + '"';
return value;
}
}
, { header: App.lang.strEmail, width: 20, dataIndex: 'usr_email', sortable: true }
, { header: App.lang.strAlias, width: 4, dataIndex: 'usr_alias', sortable: true }
, { header: "Admin", width: 4, dataIndex: 'usr_admin', sortable: true, renderer: App.renderer.TrueFalse }
]);

this.pagingBar = new Ext.PagingToolbar({
store: this.store
, pageSize: App.settings.ListMaxRows
, displayInfo: true
, emptyMsg: App.lang.strNoData,
items: ['-', 'Suche: ', ' ', new Ext.ux.SearchField({ store: this.store, width: 200 }), '-']
});
this.tbar = this.pagingBar;
bbarToolbarUser = new Ext.Toolbar()
this.bbar = bbarToolbarUser;

App.admin.UserPanel.superclass.constructor.call(this, config);
};


I am getting no errors but the input field isn't visible. By using of Extjs 2.1 is this input field visible.
After some debuging i found the reason in the generated html output.


<div id="ext-gen379" class="x-form-field-wrap x-form-field-trigger-wrap" style="overflow: hidden; width: 0px;">

If I change the width to 500px is the field visible !
Is there a way this issue to be fixed?

Thanks

floflo
1 Apr 2010, 8:38 AM
same trouble...
still no fix or nothing to do ?