Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   вставить табличку в таб панель (https://javascript.ru/forum/dom-window/71586-vstavit-tablichku-v-tab-panel.html)

Влад137 29.11.2017 18:51

вставить табличку в таб панель
 
Коллеги, оч простая задача но я не работал особо с ExtJS, поэтому решил спросить у вас. Есть код создания таб панели и есть код шаблона таблицы и объекта... помогите мне вставить таблицу в первую вкладку таб панели

var Store = [
	{
		ID: 1,
		Name: 'Ноутбук Lenovo',
		Describes: 'Ноутбук ThinkPad T460 14"FHD(1920x1080),i5-6200U(2,3GHz),4Gb,500GB@5400+8Gb cache, HD Graphics 520, WiFi,BT,TPM,FPR,WWAN ready,3cell+3cell,Cam,Win7 Pro 64 + Win10 Pro upgrade coupon,1,7kg, 3y OS',
		Price: 100,
		Quantity: 2
	}, {
		ID: 2,
		Name: 'Клавиатура OKLICK',
		Describes: 'Клавиатура OKLICK 140M,  USB, черный',
		Price: 50,
		Quantity: 8
	}, {
		ID: 3,
		Name: 'Сетевой адаптер', 
		Describes: 'Сетевой адаптер WiFi D-Link DWA-582 DWA-582/RU',
		Price: 7,
		Quantity: 0
}];

Ext.onReady(function() {
        var container = Ext.create('Ext.form.Panel', {
			title: 'Главное окно',
            width: '70%' ,
			height:400,
			cls: 'window',
			layout: 'anchor',
			defaults: {
				anchor: '100%'
			},
			renderTo: Ext.getBody(),
			
			items:[{
				xtype : 'tabpanel',
				//region: 'south',
				height: 100,
				title : 'Панель товаров',
				
				items : [{
					title : 'Товары 1',
					html: 'Контент первой вкладки',
					cls: 'tab'
                                       },{
					title : 'Товары 2',
					html  : 'Контент второй вкладки',
					cls: 'tab'
					}, {
					title : 'Товары 3',
					html  : 'Контент третьей вкладки',
					cls: 'tab'
				}]
			}],
            
			buttons: [{
					text: 'Товары',
					handler: function() {
						var el = Ext.get('.tab');
						elt.update('<b>Hello World!</b>');
					}
				}, {
					text: 'Выход',
					handler: function() {
						location.href='Окно авторизации.html';
					}
				}],
        });
    });


и шаблон :
var tpl = new Ext.XTemplate
					('<h1>TIOBE Rate</h1>',
					'<table>',
					'<tr>',
						'<td>ID</td>',
						'<td>Имя товара</td>',
						'<td>Описание</td>',
						'<td>Цена</td>',
						'<td>Количество</td>',
					'</tr>',
					'<tpl for=".">',
					'<tr>',
						'<td>{ID}</td>',
						'<td>{Name}</td>',
						'<td>{Describes}</td>',
						'<td>{Price}</td>',
						'<td>{Quantity}</td>',
					'</tr>',
					'</tpl>',
					'</table>');                          
					tpl.overwrite(Ext.getBody(), Store);
[/quote]


Часовой пояс GMT +3, время: 19:27.