Ext常见使用问题记录

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sinat_33704704/article/details/86506485

Ext4.2

在线文档地址

http://tool.oschina.net/apidocs/apidoc?api=extjs4.1%2Fdocs%2Findex.html%23%21%2Fapi

 

LoadMask防止重复提交:

var myMask = new Ext.LoadMask(Ext.getCmp(XXX).body, {msg:"请稍等。。。"});

myMask.show();

myMask.hide();

 

var myMask0 = new Ext.LoadMask(Ext.getDom("XXX"), {

        msg: '正在加载请稍等!',

        removeMask: true

});

myMask0.show();

myMask0.hide();

遮罩效果:

点击修改弹出修改的window,但是没有遮罩,可以继续点击window框后的修改,再次点击修改,原已经弹出的window框内数据直接消失卡死,点击关闭之后还是卡死状态。

需要添加一个属性

modal:true,//设置是否添加遮罩即可

 

Ext Alert 提示:

Ext.Msg.alert("提示", reslut.msg);

 

Ext.Msg.show是否

Ext.Msg.show({

                         title:'请确认是否继续操作',

                         msg: '您当前选择的与其他维保单位的选项有冲突,请确认是否继续操作',

                         buttons: Ext.Msg.YESNO,

                         //icon: Ext.Msg.QUESTION

                             fn: function (b) {

                                 if(b =='yes'){

                                 Ext.Msg.alert("提示", b);

                                 }

                             }

                      });

 

Ext getCmp()常用:

Ext.getCmp("XXX")

Ext.getCmp(XXX).getSelectionModel().getSelection();

Ext.getCmp("XXX").getForm()

Ext.getCmp("XXX ").value

Ext.getCmp("XXX ").disable();

Ext.getCmp("XXX").enable();

Ext.getCmp('XXX').show();

Ext.getCmp('XXX').hide();

时间选择框datefield

{

                   xtype: 'datefield',

                   anchor: '100%',

                   fieldLabel : '<b>开始起始时间</b>',

                   labelWidth: 115,

                   id: 'STime1',

                   //format : "Y-m-d H:i:s",

                   format : "Y-m-d",

                   maxValue : new Date()

 }

Ext密码框

{

             xtype: 'textfield',

             name: 'password',

             inputType: 'password',

             fieldLabel: '用户密码',

               validator: function (value) {

                       if (user == '') {

                           if (!regex.test(value)) {

                             return '密码中必须包含字母、数字、特殊字<br>符,至少8个字符,最多30个字符!';

                            }

                        } else {

                           if (value != null && value != '' && !regex.test(value)) {

                             return '密码中必须包含字母、数字、特殊字<br>符,至少8个字符,最多30个字符!';

                           }

                        }

                    return true;

                },

                width: 250,

                labelWidth: 80,

                x: 10,

                y: 70

},

 

Ext弹出 –固定 combo

var states = Ext.create('Ext.data.Store', {

           fields: ['id','name'],

           data : [

               {"id":"1","name":"是"},

               {"id":"0","name":"否"}

           ]

 });

 

var updatePanel = Ext.create('Ext.form.Panel', {

              frame: false,

              autoHeight: true,

              bodyStyle: 'padding: 10px 10px 0 10px;',

              labelWidth: 50,

              border:false,

              defaults: {

                  anchor: '95%',

                  allowBlank: false,

                  msgTarget: 'side'

              },

              items: [{

                  xtype:'combo',

                  id:'update_vip',

                  fieldLabel: 'vip',

                  store: states,

                  displayField: 'name'

                  ,valueField: 'id',

                  value : vip

              }]

          });

动态下拉框combo

{

                      xtype: “combo”,

                      id: “XXX”,

                      fieldLabel: “<b>Lable</b>”,

                      editable: false,

                      allowBlank: true,

                      displayField: “name”,

                      valueField: “id”,

                      store: Ext.create(“Ext.data.Store”, {

                       fields: [‘id’, ‘name’],

                       proxy: {

                            type: “ajax”,

                            url: “../XXX/getXXXList”,

                            extraParams  : {},

                            reader : new Ext.data.JsonReader({},

                               [‘id’,’name’]

                            ),

                        },

                        autoLoad: true,

                        listeners: {

                            load: function() { }

                        }

                      }),

                      width: 250,

                      labelWidth: 80,

                      value: “”,

                      listeners : {

                          select : function() {}

                      }

 }

 

Ext横向滚动条不显示

检查发现因为 forceFit : true, 导致的。

forceFit是使列强制适应grid的总宽度,把forceFit:true这个属性去掉就行了。

 

Ext关闭弹出窗口

Ext.getCmp("XXX").close();

Ext按钮的显示隐藏

Ext.getCmp('按钮id').show();显示

Ext.getCmp('按钮id').hide();隐藏

方法1:可以在定义bbar的按钮时直接给属性,hidden : true 属性,可隐藏;disabled : true 属性,可禁用

方法2:给按钮添加id,比如id:'btn';然后在panel的事件中调用Ext.getCmp('btn').disable();禁用或Ext.getCmp('btn').enable();开启。Ext.getCmp('btn').setVisible (false);隐藏或Ext.getCmp('btn').setVisible (true);显示。方法1比较固定,方法2比较灵活

Ext 表单 输入框隐藏

hidden: true,

 

Ext表单输入框 设置不可编辑

disabled: info == "" ? false : true,

false:可编辑

true:不可编辑

 

Ext 设置电话号码验证

regex:/^1[\d]{10}$/,//手机号码必须是1开头的,后面跟10位数字结尾

Ext 设置邮箱验证

vtype:'email',

纯数字验证

regex: /^\d+$/,//纯数字

Ext验证

https://blog.csdn.net/liu865033503/article/details/72842018

 

猜你喜欢

转载自blog.csdn.net/sinat_33704704/article/details/86506485