0、下拉列表具有提示文字：
您喜欢吃：
选择作品分类 {$vo} 1 extjs对话框中的图标
要在对话框中加个图片，很容易，首先加个样式：
然后在对话框中设置
Ext.Msg.show({
title:'Milton',
msg: 'Have you seen my stapler?',
buttons: {yes: true, no: true, cancel: true},
icon: 'milton-icon',
这里设置icon，指出其CSS样式就可以了。
2 对话框的选择，包括点不同按钮的反应
Ext.onReady(function(){
Ext.Msg.show({
title:'Milton',
msg: 'Have you seen my stapler?',
buttons: {yes: true, no: true, cancel: true},
icon: 'milton-icon',
defaultButton: 'no',
fn: function(btn) {
switch(btn){
case 'yes':
Ext.Msg.prompt('Milton', 'Where is it?', function
(btn,txt) {
if (txt.toLowerCase() == 'the office') {
Ext.get('my_id').dom.innerHTML = 'Work
Sucks';
}else{
Ext.get('my_id').dom.innerHTML = txt;
}
});
break;
case 'no':
Ext.Msg.alert('Milton', 'Im going to burn the building
down!');
break;
case 'cancel':
Ext.Msg.wait('Saving tables to disk...','File Copy');
break;
}
}
});
});
3 ext对某个DIV ID的引用，可以使用Ext.get('myid')来设置
4 EXT的日历，可以禁止使用某些日期，还支持正则表达式，如
{
xtype: 'datefield',
fieldLabel: 'Released',
name: 'released',
disabledDays: [1,2,3,4,5]
}]
上面的是禁止周6，日以外的所有日期，0为周日，6为周6
5 设置验证样式，比如：
{
xtype: 'textfield',
fieldLabel: 'Director',
name: 'director',
vtype: 'alpha'
}
vtype设置了验证样式，比如alpha只好允许字母和数字，还有email,url等
6 创建自定义验证方式
比如要创建一个验证，要输入的字符串之间有空格，则
{
xtype: 'textfield',
fieldLabel: 'Director',
name: 'director',
vtype: 'name'
}
Ext.form.VTypes.nameVal = /^([A-Z]{1})[A-Za-z\-]+ ([A-Z]{1})[A-Za-z\-]+/;
Ext.form.VTypes.nameMask = /[A-Za-z\- ]/;
Ext.form.VTypes.nameText = 'In-valid Director Name.';
Ext.form.VTypes.name = function(v){
return Ext.form.VTypes.nameVal.test(v);
};
其中xxxxVal是用于匹配的正则表达式；xxxMask，屏蔽限制用户的输入；xxxxText:用于错误信息
7 表单中，监听回车按键的事件
items: [{
xtype: 'textfield',
fieldLabel: 'Title',
name: 'title',
allowBlank: false,
listeners: {
specialkey: function(frm,evt){
if (evt.getKey() == evt.ENTER) {
movie_form.getForm().submit();
}
}
}
8 GRID中的单元格显示函数
在某列中使用HTML和图形，比如：
{header: "Cover", dataIndex: 'coverthumb', renderer: cover_image},
function cover_image(val){
return '
';
}
9 GRID中监听某行被选择；
sm: new Ext.grid.RowSelectionModel({
singleSelect: true,
listeners: {
rowselect: {
fn: function(sm,index,record) { Ext.Msg.alert('You
Selected',record.data.title); }
}
}
}),
注意第一行为0序号
10 做一个按钮，单击时可以编辑某一行的数据
tbar: [{
// changes the title of the currently selected row usign a messagebox
text: 'Change Title',
handler: function(){
var sm = grid.getSelectionModel();
// get the selected row (if exists)
var sel = sm.getSelected();
// has something been selected?
if (sm.hasSelection()){
Ext.Msg.show({
title: 'Change Title',
prompt: true,
buttons: Ext.MessageBox.OKCANCEL,
value: sel.data.title,
fn: function(btn,text){
if (btn == 'ok'){
// set a new value for one of the
// columns in our selected row
sel.set('title', text);
}
}
});
}
}
11 在editorgrid中，判断某些行不可编辑，采用afteredit事件就可以了
listeners: {
afteredit: function(e){
if (e.field == 'director' && e.value == 'Mel Gibson'){
Ext.Msg.alert('Error','Mel Gibson movies not allowed');
e.record.reject();
}else{
e.record.commit();
}
}
注意，e.filed是判断所在的列，e.value判断所在的哪一行
12、在Ext grid中假设有一个名称为grid的对象。
(1)grid.getStore().getRange(0,store.getCount());//得到grid所有的行
(2)grid.getSelectionModel().getSelections()//得到选择所有行
(3)grid.selModel.selections.items;//得到选择所有行
(4)grid.getSelectionModel().getSelected();//得到选择行的第一行
13、extjs的gridpanel制定列的颜色
14、extjs的gridpanel制定行的颜色
