Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.12.2018, 16:42
Интересующийся
Отправить личное сообщение для Postgeograph Посмотреть профиль Найти все сообщения от Postgeograph
 
Регистрация: 08.11.2018
Сообщений: 14

Отображение имен столбцов класса grid
Добрый день.

при вызове элементов класса tab, содержащих custom классы grid в дебагере браузера вылетает следующе предупреждение:
Warning, size detected (calc(100% - 16px)) not a valid property value on Element.addUnits., а сами гриды отображают только заголовки столбов (store подключен нормально, записи видно на долю сек при рендеренге класса):


Код класса содержащего tab:


Ext.define('Foresto.view.forms.LoginWorkSpace', {
    extend: 'Ext.panel.Panel',
    requires: ['Foresto.model.EditListRenters',
              'Foresto.model.EditLCA',
              'Ext.field.Select',
              'Ext.panel.Panel',
              
              'Ext.tab.Panel'
              ],
   
    
    height: '80%',
    layout:'fit',
    id:'loginWS',
    fullscreen: true,
    
    closable: false,
    header: {
        cls: 'header-cls'
        
    },
    scrollable: true,
    
    xtype: 'loginWS',
    title: 'ЛИЧНЫЙ КАБИНЕТ',
    
    
    modal: true,
    hideOnMaskTap: true,
    showAnimation: {
        type: 'popIn',
        duration: 250,
        easing: 'ease-out'
    },
    hideAnimation: {
        type: 'popOut',
        duration: 250,
        easing: 'ease-out'
    },
    centered: true,
    width:  '100%',
    
    items:[{
    	xtype:'tabpanel',
    	fullscreen: true,
    	cls: 'header-cls',
    	width:  '100%',
    	height: '80%',
    	
    	
    	
    	
    	shadow: true,
        activeTab: 1,
        
        defaults: {
            scrollable: true,
            userSelectable: {
               bodyElement: true
            }
        },
    	items: [
    	        {
    	        	xtype: 'panel',
    	        	layout:'vbox',
    	        	
    	        	title: 'ИНФОРМАЦИЯ О ПОЛЬЗОВАТЕЛЕ',
    	        	cls: 'header-cls',
    	        	
    	        	items:[
    	        	       {xtype: 'selectfield',
    	        	        label: 'Имя',
    	        	        margin: 4,
    	        	       },{
    	        	    	xtype: 'selectfield',
       	        	        label: 'Статус',
       	        	        margin: 4,
    	        	       },{
    	        	    	xtype: 'selectfield',
       	        	        label: 'Регион',
       	        	        margin: 4,   
    	        	       },{
    	        	    	xtype: 'button',
    	        	    	ui:'confirm',
    	        	    	text:'Добавить арендатора',
    	        	    	handler: addRenter	
    	        	 
    	        	    	},{
    	        	    	xtype: 'button',
        	        	    text:'Редактировать профиль'
    	        	    	}
    	        	       ]
    	        },
    	        {	xtype: 'contlistII',
    	        	title: 'СПИСОК ДОГОВОРОВ'
    	        },
    	        {	xtype: 'panel',
    	        	title: 'СПИСОК 2'
    	        		
    	        },{	xtype: 'rentlist',
    	        	title: 'АРЕНДАТОРЫ'
    	        	
    	        	
    	        }
    	        ]
    }],
    
   
    scrollable: true,
    scope: this
});


код грида:

Ext.define('Foresto.model.EditListRenters', {
	extend:'Ext.grid.Grid',
	xtype: 'rentlist',
	requires: [
	'Ext.grid.plugin.Editable',
	'Ext.grid.plugin.ViewOptions',
	'Ext.grid.plugin.PagingToolbar',
	'Ext.grid.plugin.SummaryRow',
	'Ext.grid.plugin.ColumnResizing',
	'Ext.grid.plugin.MultiSelection',
	'Ext.grid.plugin.RowExpander',
	'Ext.grid.Grid',
	'Foresto.model.RentsListModel'
	],
	shadow: true,
	rowLines: true,
	store: {
		model:'Foresto.model.RentsListModel', 
		autoLoad: true,
		pageSize:0,
		proxy: {
			type:'ajax',
			url:'/api/renter/',
			reader:{
				type:'json',
				rootProperty: 'results'
			}
		
		}
	},
	plugins: [
		{
	        type: 'grideditable'
	    }, {
	        type: 'gridviewoptions'
	    }, {
	        type: 'pagingtoolbar'
	    }, {
	        type: 'summaryrow'
	    }, {
	        type: 'columnresizing'
	    }, {
	        type: 'rowexpander'
	    }
	],
   
	columns: [
	{
		text: 'id',
		maxWidth: 60,
		dataIndex: 'id'
	},{
                         ...
        },{
		text:'certificate',
		dataIndex:'certificate'
	}
	]
	
	
});


при удалении всех layout и инициализации классов 'rentlist' и 'contslist' не напрямую (как в коде выше), а как объект другого класса:
{  
    xtype: 'panel',
    title: 'ДОГОВОР',
    items: [
       {xtype:'contlistII'}
    ]
},


получаю тоже весьма печальное зрелище:


Как пофиксить этот косяк? Какая конфига может отвечать за размер отображения оглавления грида ? Спасибо.
Ответить с цитированием
  #2 (permalink)  
Старый 13.12.2018, 17:34
Профессор
Отправить личное сообщение для siber-biber Посмотреть профиль Найти все сообщения от siber-biber
 
Регистрация: 07.08.2013
Сообщений: 214

фидл нужен.. иначе это гадание надолго

что вот эта строка должна делать?
height: '80%',

просто вы выше на контейнере укaзали:
layout : "fit"

то есть "содержимое контейнера должно растягиваться по размерам контейнера"
и при этом на панели лежащей в этом контейнере ставите height:80% ?
Ответить с цитированием
  #3 (permalink)  
Старый 10.01.2019, 09:17
Интересующийся
Отправить личное сообщение для Postgeograph Посмотреть профиль Найти все сообщения от Postgeograph
 
Регистрация: 08.11.2018
Сообщений: 14

Проблема не решена.
Добрый день. Проблема так и не была решена.
https://fiddle.sencha.com/#view/editor&fiddle/2ovk

Обнаружил что если провести в дебагере хромиума какую либо манипуляцию с padding/ marging для объекта gridheadercontainer то данный пробел в хидере исчезает. при нажатии на заголовок столбца для сортировки, пробел появляется вновь. При это в firefox данного пробела в хидере нет..

Последний раз редактировалось Postgeograph, 10.01.2019 в 15:32.
Ответить с цитированием
  #4 (permalink)  
Старый 11.01.2019, 10:40
Аватар для Infarch
Профессор
Отправить личное сообщение для Infarch Посмотреть профиль Найти все сообщения от Infarch
 
Регистрация: 06.06.2014
Сообщений: 290

Фидл не работает. Если будете чинить, то может и выкините все лишнее? Минималистичный пример гораздо нагляднее. А если при этом еще и ошибка прпадет то вообще красота
Изображения:
Тип файла: png fff.png (3.9 Кб, 3 просмотров)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Добавление класса (отображение подменю) rudoy24 jQuery 2 06.04.2017 23:26
Отображение данных Grid по клику на строку другой Grid Sogl ExtJS 5 06.12.2016 08:18
Использование классов в JavaScript devote Ваши сайты и скрипты 70 01.02.2013 15:17
Свойства/методы класса TicTac Общие вопросы Javascript 5 03.07.2011 13:53
Модуль для работы с модулями JSprog Ваши сайты и скрипты 29 02.09.2009 12:31