21Extjs笔记

1.关于工程中的某个文件变成另一种的编码，就用右键property就好了。

2.本节的内容

注意最后一个并没有继承自根类field.base.

虽然说基类是第一个但是我们经常实现第二个。

 继承关系

一个容器加上一个实例就是这样的一个表单。  第一个是示例，第二个是实例。

表单里面的每一项就是一个field  这个field的根类就是下面的

3.关于混入了一些类的做法说明，mixin 就是说拥有了一些类就是了。

5.关于表单的理解(由于混入了两个类  一个是lable类，另一个是field类)

6.下面就是关于文本框方式的(由于混进了类)

下面就是小文本框和大的文本框

下面的大文本域的类就是继承自上面的小的文本框的类。

7.下面就是触发类

时间选择器也是触发器

8.下面就是combobox

9. 单选框和多选框

 

10.数据的交互主要是靠的下面的这个包中的东西

11. 下面两种提交的跳转的方式的讲解

原始的就是 将参数进行传递，然后再进行相应的跳转就可以了。

12.vtype这个类是用来做表单数据验证的

13.下面的这个类主要负责将空间进行阻隔的。

14.这个包的说明就是一个控制数据，另一个用来控制布局的

15.实例化的时候首先使用大纲的第二个，然后可以用大纲的第二个从而获取大纲里面所讲的第一个。

16.关于渲染到一个div的做法。

利用renderTo写上这个div的id就好了
renderTo:"divID"

17.defaultType的用法：就是里面的所有的元素要是不写类型的话，就直接赋予这样的一个类型。

defaults 就是说这一个容器里面的所有的东西要是没有配置的话，就直接引用这里的一个元素就好了。

18.注意文档的子类和文档的mixins的区别
 

要是混合了一个类的话，就是说具有了这个类的一个功能。
于是直接点击进去，然后查看这个子类的属性，然后再在defaults里面进行配置就好了。

19.关于在文档中一个配置和他的属性的情况：

20.关于items的进一步的理解

这里面的这些参数就是所谓的对象的config的配置项就是在文档的config的里面。

21.关于正则表达式的定界符。

就是两边的定界符号。

22.关于在非mvc下面的使用登陆框的思路

就是用按钮获得整个登陆框，然后在获得里面的控件的数值就好了。

23.有一个思路就是说当两个对象之间发生关系的时候，首先看看这两个对象之间的所有的方法看看可以解决吗，然后在看看这两个对象之间是不是可以利用一个中间的变量进行解决这个呢，上面的通过登录的按钮获得文本框的数值就是这样的一个做法。

24.下面这两个讲的是数据如何进行相应的验证，然后验证不通过的提示的信息是什么。

25下一步进行扩展的验证。就是说，验证并不能够满足我们的需求，于是就进行相应的验证的工作。

26.通过正则进行相应的验证的工作

27.下面的这种验证的方式就是比较强硬了，就是你想输入一个一个不符合格式的字符串，你直接就是不能输入的。

28.变量之间可以可以这样进行使用

29.自己看看自己如何进行编辑这些数据呢。

30.类中的这些方法一般都是通过basic的这些方法来进行实现的。

31.将表单直接进行装载。
选择的是上面的方法请看下面。

32.建立model和创建新的model。

33.下面是本节课的源代码

Ext.onReady(function(){//-------------------------------------Ext.define("person",{extend:'Ext.data.Model',fields:[{name:'userName',type:'auto'},{name:'password',type:'auto'}]});var p = new person({userName:'[e-mail]',password:"123456"});//-------------------------------------var passTest = /[123]/iExt.apply(Ext.form.field.VTypes,{myPass :function(val,field){return passTest.test(val);},myPassText:"密码格式错误",myPassMask:/[123]/i});//-------------------------------------var textForm = Ext.create("Ext.form.Panel",{title : "form中文本框实例",bodyStyle :'padding:5 5 5 5',frame : true,height : 120,width : 300,id:'my_form',renderTo:'formDemo',defaultType:'textfield',defaults:{labelSeparator :": ",labelWidth : 50,width : 200,allowBlank: false,msgTarget : 'side',labelAlign:'left'},items:[{fieldLabel : "Name",name:'userName',id:'userName',selectOnFocus : true,regex:/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/,regexText:"请用邮箱来注册",grow:false//是否在这个表单字段规定长度内自动根据文字的内容进行伸缩},{fieldLabel : "Pass",name:'password',id:'password',inputType:'password',vtype:'myPass'}],buttons: [  {text:'登陆系统',handler:function(b){  //我没想通过base来得到数值,那我们就要先得到base   //那么base我们有什么办法来的到呢?  //很简单 通过 Ext.form.Basic(findField( String id ) : void)  //那么Ext.form.Basic如何得到呢?  //很简单Ext.form.Panel (getForm( ))  //Ext.form.Panel如何得到呢?  //很简单 1>通过ID来的  var formObj = Ext.getCmp("my_form");  var basic = formObj.getForm();  var nameField = basic.findField("userName");  var nameValue = nameField.getValue();  alert(nameValue);  }},{  text:'重置',handler:function(b){  var formObj = Ext.getCmp("my_form");  var basic = formObj.getForm();  basic.reset();  }  },{  text:'装在数据',handler:function(b){  var formObj = Ext.getCmp("my_form");  var basic = formObj.getForm();  basic.loadRecord(p);  }    }]})});