Горизонтальная прокрутка в gridPanel
Здравствуйте!
Имеется GridPanel, с большим количеством столбцов. Все столбцы, естественно, на экран не влезают. Необходимо добавить горизонтальную прокрутку. Поиск по данному вопросу, увы, не дал внятного ответа. ExtJS 3.0 Код такой (генерится скриптом): Ext.onReady(function(){ var store = new Ext.data.JsonStore({ root: 'items', totalProperty: 'totalCount', idProperty: 'guid', remoteSort: true, fields: ["guid","id","name","md5","email","last_activity","reg_date","group","uname","ulastname","ufather","ubirthday","side","region","sity","sex","active","deact","rpass_id","passportS","passportN","address","admin","userAgent","currentIP","workPlace","validThru","createdBy"], proxy: new Ext.data.HttpProxy({ url: '/data/get/' }) }); var colModel = new Ext.grid.ColumnModel([{"dataIndex":"guid","header":"GUID","sortable":true},{"dataIndex":"name","header":"\u041b\u043e\u0433\u0438\u043d","sortable":true},{"dataIndex":"md5","header":"\u041f\u0430\u0440\u043e\u043b\u044c","sortable":true},{"dataIndex":"email","header":"\u041c\u044b\u043b\u043e","sortable":true},{"dataIndex":"last_activity","header":"last_activity","sortable":true},{"dataIndex":"reg_date","header":"reg_date","sortable":true},{"dataIndex":"group","header":"group","sortable":true},{"dataIndex":"uname","header":"uname","sortable":true},{"dataIndex":"ulastname","header":"ulastname","sortable":true},{"dataIndex":"ufather","header":"ufather","sortable":true},{"dataIndex":"ubirthday","header":"ubirthday","sortable":true},{"dataIndex":"side","header":"side","sortable":true},{"dataIndex":"region","header":"region","sortable":true},{"dataIndex":"sity","header":"sity","sortable":true},{"dataIndex":"sex","header":"sex","sortable":true},{"dataIndex":"active","header":"active","sortable":true},{"dataIndex":"deact","header":"deact","sortable":true},{"dataIndex":"rpass_id","header":"rpass_id","sortable":true},{"dataIndex":"passportS","header":"passportS","sortable":true},{"dataIndex":"passportN","header":"passportN","sortable":true},{"dataIndex":"address","header":"address","sortable":true},{"dataIndex":"admin","header":"admin","sortable":true},{"dataIndex":"userAgent","header":"userAgent","sortable":true},{"dataIndex":"currentIP","header":"currentIP","sortable":true},{"dataIndex":"workPlace","header":"workPlace","sortable":true}]); var gridView = new Ext.grid.GridView({ autoScroll: true }); var selModel = new Ext.grid.RowSelectionModel({ singleSelect : true }); var grid = new Ext.grid.EditorGridPanel({ title : 'превед!!', renderTo : Ext.getBody(), autoHeight : true, width: 700, autoScroll: true, store : store, view : gridView, colModel : colModel, selModel : selModel, autoSizeColumns: true, sm: new Ext.grid.RowSelectionModel({singleSelect:false}), frame: true, bbar: new Ext.PagingToolbar({ pageSize: 10, store: store, displayInfo: true, displayMsg: 'Отображаются с {0} по {1}. Всего: {2}', emptyMsg: "Нет объектов для отображения" }) }); store.setDefaultSort('guid', 'desc'); store.load({params:{start:0, limit:10}}); }); Надеюсь на вашу помощь. Что нужно сделать, чтобы горизонтальный скроллбар появился? Заранее спасибо! :) |
Проблема решилась.
Оказывается необходимо четко указать height и никаких autoHeight не должно быть. :) |
эту проблему еще можно решить, добавив css свойство overflow: auto
|
Часовой пояс GMT +3, время: 19:50. |