Изменение границы сетки

Question

Я следующий код, который я создающего сетку

var store = Ext.create('Ext.data.ArrayStore', { 
    fields: [ 
    { name: 'company' }, 
    { name: 'price', type: 'float' }, 
    { name: 'change', type: 'float' }, 
    { name: 'pctChange', type: 'float' } 

], 
    data: myData 
}); 
var grid = Ext.create('Ext.grid.Panel', { 
    store: store, 
    renderTo: 'divGrid', 
    columns: [ 
    { text: 'Company', 
     flex: 1, 
     dataIndex: 'company' 
    }, 
    { text: 'Price', 
     flex: 1, 
     dataIndex: 'price' 
    }, 
    { text: 'Change', 
     flex: 1, 
     dataIndex: 'change' 
    }, 
    { text: '% Change', 
     flex: 1, 
     dataIndex: 'pctChange' 
    }], 
     height: 250, 
     width: '100%', 
     title: 'Array Grid', 
     renderTo: 'grid-example', 
     viewConfig: { 
      stripeRows: true 
     } 
    }); 

}); 

Я хочу, чтобы изменить цвет и ширину границы сетки. Как мне это сделать ?

Answer 1

Быстрая и грязная вы можете установить этот конфиг на любой сетке или действительно любой компонент, который втягивает ящик:

style: 'border: solid Red 2px' 

Более правильный способ заключается в создании правила CSS и установить cls:'myRedBorderRule "в конфигурации.

EDIT:

var grid = Ext.create('Ext.grid.Panel', { 
    store: store, 
    renderTo: 'divGrid', 
    style: 'border: solid Red 2px', 
    ..... 

Answer 2

Класс панели панели ExtJS предоставляет параметры для определения ваших пользовательских стилей. Вы можете использовать следующие параметры класса:

• границы
• Bodystyle
• bodyCls
• bodyBorder
• bodyPadding

Вы можете использовать комбинацию этих параметров для управления сетки-х стилей границ и стилей. Подробные сведения об этих параметрах см. В документах.