extjs遇到的问题和解决方式

1.设置label的对齐方式
labelAlign: 'left'
2.设置label的宽度
labelWidth:60,
3.设置整个组件的宽度
width
4.对于textfield可以设置的验证有哪些即Vtype
alpha,alphanum,email,url
5.如何自定义一个vypte
Ext.apply(Ext.form.field.VTypes, {
//IPAddress为vypte的名
    IPAddress:  function(v) {
        return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
    },
//错误时显示的文本
    IPAddressText: 'Must be a numeric IP address',
    //字段的值
IPAddressMask: /[\d\.]/i
});


6.添加自己的样式
style: 'margin-top:15px',
7.找store
Ext.data.StoreManager.lookup('UserStore')
找model
Ext.ModelManager.getModel('User');




8.典型的 proxy配置
proxy:{
type:'ajax',
api:{
read:'app/data/users.json',
update:'app/data/updateUsers.json'
},
reader:{
type:'json',
root:'users',
successProperty:'success'
}
}
#grid.panel不显示红色三角号
view: Ext.grid.GridView({markDirty: false})
viewConfig: {
markDirty: false
}
9.设置label的宽度与对齐方式
labelWidth: 100,
   labelAlign:'right'


10.如何在表单元素后加说明文字
用xtype:'fieldcontainter'
{
xtype : 'fieldcontainer',
labelWidth : 60,
fieldLabel : '联系电话',
layout : 'hbox',
width : 300,
items : [ {
xtype : 'textfield',
name : 'phone-1',
width : 40,
allowBlank : false
}, {
xtype : 'displayfield',
value : '-'
},]
}


11.为proxty的地址添加额外的参数
this.store.proxy.extraParams= {limit:5,cid:cid}  
this.store.load();  




12.自定义一fieldcontainer
var dataTypeStore=Ext.create('Ext.data.Store',{
fields:['name','value'],
data:[
{'name':'string','value':'string'},
{'name':'int','value':'int'},
{'name':'boolean','value':'boolean'}]
});
Ext.define('js.modelfield',{
extend:'Ext.form.FieldContainer',
labelWidth : 60,
fieldLabel : '字段名',
layout : 'hbox',
width : '100%',
items : [{
xtype : 'textfield',
name : 'fieldname[]',
width : 200,
allowBlank : false
},{
xtype : 'combobox',
fieldLabel:'数据类型',
labelAlign:'right',
name : 'fieldtype[]',
width : 200,
emptyText:'选择数据类型',
editable:false,
store:dataTypeStore,
queryMode:'local',
displayField:'name',
valueField:'value',
allowBlank : false
},
{
xtype : 'textfield',
labelAlign:'right',
labelWidth:40,
fieldLabel:'默认值',
name : 'defaultvalue[]',
width : 200
},{
xtype:'button',
text:'删除',
listeners:{
click:function(btn,e,ept){
var tempform=this.up('form');
var tempfielcontainer=this.up('fieldcontainer');
console.log(tempform);
console.log(tempfielcontainer);
tempform.remove(tempfielcontainer,true);
}
}
}]
});






13.Ext.apply, Ext.applyif, Ext.override之间的区别


Ext.apply, Ext.applyif, Ext.override 都是对对象 进行扩展的方法，Ext.extend则是对类 操作的方法。
Ext.apply 扩展时对已经存在的属性/方法会被覆盖掉， 通常用它来扩展普通对象.
Ext.applyif 扩展时不会覆盖已经存在的属性/方法，通常用它来扩展核心js，如Array.prototype，String.prototype等。
Ext.override 扩展某一个类的原型，可以覆盖toString方法。
Ext.extend 用来写类或继承，或者说用来扩展类。








14.在弹出窗口的表单中，如果想加载数据可以
form.loadRecord(model对象);




15.在弹出窗口的表单中，如果想修改其中某个字段的值
var form=win.down('putviewadd');
var bform=form.getForm();
bform.setValues({parentid:parentid});


16.为什么实例化treestore的model对象的时候会多出很多在model的fields中没有定义的字段?




17.extjs4 checktree父节点和子节点选中控制(权限控制树)
 为树面板添加监听器 
listener:


{


checkchange : function(node, checked) {
   if (checked == true) {
    node.checked = checked;
    // console.dir(node.parentNode);
    //alert(node.get("leaf"));


    //获得父节点
    pNode = node.parentNode;


  //当checked == true通过循环将所有父节点选中
    for (; pNode != null; pNode = pNode.parentNode) {
     pNode.set("checked", true);
    }
   }


  //当该节点有子节点时，将所有子节点选中删除
   if (!node.get("leaf") && !checked)
      node.cascade(function(node){
     node.set('checked', false);
     
    });


}
 
18.如果表单中fieldset
#自定义validator
IP地址验证 
Ext.apply(Ext.form.field.VTypes, {
    IPAddress:  function(v) {
        return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
    },
    IPAddressText: 'Must be a numeric IP address',
    IPAddressMask: /[\d\.]/i
});


19.不显示面板上的title这一条
header:false,


20.将数组转为json,然后通过ajax传给php
Ext.Array.each(records,function(rec){
var tempobj={moduleid:rec.get('id'),groupouser:rec.data.groupouser,identity:rec.data.groupouserid};
ids.push(tempobj);
});
var idsjson=Ext.JSON.encode(ids);
console.log(idsjson);
Ext.Ajax.request({
url:'/index.php/Sysuser/putviewedit',
method:'POST',
param:{name:'chen',age:222},
jsonData:idsjson,
success:function(response,opts){}
});


开始时间大于
Ext.apply(Ext.form.field.VTypes, {
daterange: function(val, field) {
var date = field.parseDate(val);


if (!date) {
return false;
}
if (field.startDateField && (!this.dateRangeMax || (date.getTime() != this.dateRangeMax.getTime()))) {
var start = field.up('form').down('#' + field.startDateField);
start.setMaxValue(date);
start.validate();
this.dateRangeMax = date;
}
else if (field.endDateField && (!this.dateRangeMin || (date.getTime() != this.dateRangeMin.getTime()))) {
var end = field.up('form').down('#' + field.endDateField);
end.setMinValue(date);
end.validate();
this.dateRangeMin = date;
}
/*
* Always return true since we're only using this vtype to set the
* min/max allowed values (these are tested for after the vtype test)
*/
return true;
},


daterangeText: 'Start date must be less than end date',


password: function(val, field) {
if (field.initialPassField) {
var pwd = field.up('form').down('#' + field.initialPassField);
return (val == pwd.getValue());
}
return true;
},


passwordText: 'Passwords do not match'
});