extjs4 相关
共通:
labelSeparator:''//表示fieldLabel后不会显示冒号“:”
readOnly:true//只读
focusCls: 'txtHalfInput'//有焦点时的样式
maxLength:3, enforceMaxLength:true//输入位数check
fieldStyle: 'margin-top:3px;'//display上下不对齐解决办法
Ext.button.Button
属性:
enableToggle:true//设置按钮为开关状态
pressed:true//开关没被按下状态
disabled: true//使按钮不可用,false可用
方法:
var pressed = Ext.getCmp('buttonGuard').pressed;//是否是被按下的状态
Ext.form.field.Text
属性:
fieldStyle: 'ime-mode:disabled',//设置text的样式
fieldCls: 'txtHalfInput',//设置text的class
方法:
focus(true,600);//设置焦点,true表选中内容,false表只设焦点;600表页面加载完毕0.6秒后执行
Ext.form.field.ComboBox
属性:
valueField:'ID' //下拉里的key值
displayField: 'NAME'//下拉里显示的内容
editable: false//false不可手动改值,true可以手动改
validator: function (v) {//表单项自定义check
return 'unvalidator';//返回true表示合法,否则为表单错误提示信息
}
方法:
get/setRawValue//得到或设置combo所选值
Ext.form.NumberField
属性:
hideTrigger: true,//不显示控件右边的上下箭头
//实现焦点一离开后,1.00直接变成1
Ext.form.GNumberField = Ext.extend(Ext.form.NumberField, {
setValue: function (v) {
v = typeof v == 'number' ? v : String(v).replace(this.decimalSeparator, ".");
v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
//this.replaceDecimalVal(v);
// if you want to ensure that the values being set on the field is also forced to the required number of decimal places.
// (not extensively tested)
v = isNaN(v) ? '' : this.fixPrecision(String(v).replace(".", this.decimalSeparator));
var ret = Ext.form.NumberField.superclass.setValue.call(this, v);
this.setRawValue(v);//没有这句则控件上不显示1.00
return ret;
},
fixPrecision: function (value) {
var nan = isNaN(value);
if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
return nan ? '' : value;
}
value = this.replaceDecimalVal(value);
return parseFloat(value).toFixed(this.decimalPrecision);
},
//防止四舍五入
replaceDecimalVal: function (v) {
var vArr = v.toString().split('.');
if (vArr.length > 1) {
if (vArr[1] > this.decimalPrecision) {
var dec = vArr[1].substring(0, this.decimalPrecision);
v = vArr[0] + '.' + dec;
}
}
return v;
}
}
Ext.tree.Panel
属性:
rootVisible: true//显示树的根结点,false不显示
collapsible: true//true可以点左箭头折叠,false不可折叠
leaf: true//true表示是子结点,并且不能再有子结点
expanded: true//设置结点自动展开
root: {//树结点
text: '$',//结点显示内容
expanded: true,//展开结点
children: [//子结点
{
text: 'グループ1',
expanded: true,
children: [
{ id: '1', text: 'power1', leaf: true }
]
},
{ text: 'グループ2', expanded: true },
{
text: 'グループ3',
expanded: true,
children: [
{ text: 'power1', leaf: true },
{ text: 'power2', leaf: true },
{ text: 'power3', leaf: true }
]
}
]
}
listeners: {
itemclick: function (treePnl, record, item, index, e) {//树结点的click事件
//record.data.root=true 表示该结点是根结点
//record.data.parentId = 'root' 表示该结点的父结点为根结点,也表示父结点的ID
if (!record.data.root && record.data.parentId != 'root') {
var parentText = record.parentNode.data.text;//父结点的显示内容
var text = item.innerText;//当前结点的显示内容
Ext.getCmp('displayPSTGroupName').setValue(parentText);
Ext.getCmp('displayPSTName').setValue(text);
} else {
Ext.getCmp('displayPSTGroupName').setValue('');
Ext.getCmp('displayPSTName').setValue('');
}
}
cellclick: function (view, e, columnIndex, rowItem) {
//view:
//e:
//columnIndex:所点列的索引,0开始
//rowItem: rowItem.data表示选中行的数据
}
}
方法:
setNodeFocus(结点ID)//设置某结点为选中状态
collapse()//让整个树折叠起来
Ext.getCmp('treePnl').collapseAll();//收起所有的结点
Ext.getCmp('treePnl').getStore().getNodeById('root').expand();//展开根结点
Ext.GridStore
属性:
autoLoad: true//自动加载数据
dataFields:[{name:EVENT_ID}]//字段名
方法:
var minGenTime = store.min('EVENT_GEN_TIME');//获取字段EVENT_GEN_TIME最小值
var r = {};
store.each(function (record) {//遍历数据
if (record.get('EVENT_GEN_TIME') == minGenTime) {
r = record.raw;//获取一条数据
return;
}
});
事件:
beforeload:function(store, operation, options){}//数据加载前发生的事件
datachanged:function(store, options){}//数据发生改变后发生的事件
Ext.grid.Panel
属性:
multiSelect: true//允许item项可以多选,false不可
selType: 'cellmodel'//表示点选cell,无该属性则点选行
plugins: [Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 1})]//该属性配合selType:'cellmodel'可实现编辑cell效果
columns:[new Ext.grid.RowNumberer({ width: 30, locked: false, header: " " })]//自动升番番号
方法:
Ext.getCmp('gridEvent').getStore().removeAll();//清除grid里的记录
Ext.getCmp('grid').plugins[0].completeEdit();//当cellEditing时,编辑完不直接离开焦点而是直接点submit,此时会出现edit里仍然是原值的情况,解决办法是调一下completeEdit方法
treePnl.fireEvent('itemclick', treePnl, treePnl.getSelectionModel().getLastSelected());//触发treeNode的单击事件
//添加事件
Ext.getCmp('xxxxx').on('事件名', function(){})
//JS日期控件要格式化日期后再往后台传值
CREATE_TIME: !Ext.isEmpty() ? '' : Ext.util.Format.date(Ext.getCmp('datefieldLoginBegin').getValue(), 'Y/m/d')
//日期控件check
Ext.getCmp('datefieldStartDate').isValid()
//tabPanel子项添加关闭事件
contentPanel.add({
id: nodeId,
title: nodeText,
closable: true,
header: false,
listeners: { 'beforedestroy': function () { callDestroy(nodeId); } },//添加tab项的关闭事件
html: '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src= "' + node.attributes.actionPath + '"></iframe>'
});
//title居中
title: '帳票テンプレート一覧',
titleAlign: 'center',
style: 'text-align:center',
//解决双击treeNode后变成文件夹
treeItemClick: function (treePnl, record, item, index, e) {
record.data.leaf = true;//在treeclick方法最后一行加上这句
},