extjs的相关属性
通用属性:
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方法最后一行加上这句 },
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。