码迷,mamicode.com
首页 > Web开发 > 详细

extjs的相关属性

时间:2015-12-27 19:15:57      阅读:272      评论:0      收藏:0      [点我收藏+]

标签:

通用属性:

    labelSeparator:''//表示fieldLabel后不会显示冒号“:”

    readOnly:true//仅仅读

    focusCls: 'txtHalfInput'//有焦点时的样式

    maxLength:3, enforceMaxLength:true//输入位数check

    fieldStyle: 'margin-top:3px;'//display上下不正确齐解决的方法

Ext.button.Button

属性:

enableToggle:true//设置button为开关状态

pressed:true//开关没被按下状态

disabled: true//使button不可用,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方法最后一行加上这句

    },



extjs的相关属性

标签:

原文地址:http://www.cnblogs.com/bhlsheji/p/5080539.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!