ExtJS例文辞典

便利なサイトを見つけました。
ExtJS例文辞典

HTMLEditorのフォント指定リストを追加する手順

HTMLEditorについて、フォント指定リストにフォントを追加する手順です。

HtmlEditorのconfigOptionのfontFamilies属性を設定します。

var top = new Ext.FormPanel({
labelAlign: 'top',
frame:true,
title: 'Multi Column, Nested Layouts and Anchoring',
bodyStyle:'padding:5px 5px 0',
width: 600,
items: [{
layout:'column',
items:[{
columnWidth:.5,
layout: 'form',
items: [{
xtype:'textfield',
fieldLabel: 'First Name',
name: 'first',
anchor:'95%'
}, {
xtype:'textfield',
fieldLabel: 'Company',
name: 'company',
anchor:'95%'
}]
},{
columnWidth:.5,
layout: 'form',
items: [{
xtype:'textfield',
fieldLabel: 'Last Name',
name: 'last',
anchor:'95%'
},{
xtype:'textfield',
fieldLabel: 'Email',
name: 'email',
vtype:'email',
anchor:'95%'
}]
}]
},{
xtype:'htmleditor',
id:'bio',
fieldLabel:'Biography',
height:200,
anchor:'98%',
fontFamilies : [
'Arial',
'Courier New',
'Tahoma',
'Times New Roman',
'Verdana',
'ＭＳ Ｐゴシック',
 'ＭＳ 明朝',
 ]
}],

buttons: [{
text: 'Save'
},{
text: 'Cancel'
}]
});

top.render(document.body);

Gridのヘッダー部を非表示にする手順

Gridのヘッダー部を非表示にする方法は1.1と2.0以降で異なります。
・1.1でのGridのヘッダー部を非表示にする方法
grid.render()の後ろに以下の一文を追加します。
grid.getGridEl().select('.x-grid-header').setStyle('display','none');

・2.0でのGridのヘッダー部を非表示にする方法
configOptionでhideHeadersをtrueに設定します。
// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'company',header: "Company", width: 160, sortable: true, dataIndex: 'company'},
{header: "Price", width: 75, sortable: true, renderer: 'usMoney', dataIndex: 'price'},
{header: "Change", width: 75, sortable: true, renderer: change, dataIndex: 'change'},
{header: "% Change", width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
{header: "Last Updated", width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
],
stripeRows: true,
autoExpandColumn: 'company',
height:350,
width:600,
title:'Array Grid',
hideHeaders:true
});