extjs 学习自我理解

一、js类的声明其实就是一个function

    function user(){

 

  }

 

二、在Ext中创建模型类的方法:( 两种)

 (1)   Ext.define('person'{

        extend:'Ext.data.Model'

         fields:[

              {name:'name',type:'auto'},

              {name:'age',type:'auto'},

         ]

    });

(2) Ext.regModel('person',{

         fields:[

              {name:'name',type:'auto'},

              {name:'age',type:'auto'},

         ]      

    });

实例化我们的person类(三种实例化方法)

(1)var p=new person({                      alert(p.get('name'))   //

    name:'dxj',

    age:20

      });

(2)var p= Ext.create('person',{        alert(p.get('name'));

    name:'dxj',

    age:20

});

(3) var p=Ext.ModelMgr.create({

    name:'dxj',                                alert(p.get('name'));

    age:20

},'person');                         alert(person.getName());

 

三、数据验证

Ext.data.validations.lengthMessage='错误的长度';

 (1)   Ext.define('person'{

        extend:'Ext.data.Model'

         fields:[

              {name:'name',type:'auto'},

              {name:'age',type:'auto'},

         ]，

        validations:[

                   {type:"length",field:"name",min:2,max:6}

            ]

    });

var p= Ext.create('person',{        alert(p.get('name'));

    name:'dxj',

    age:20

});

 

var errors=p.validate();

errors.each(function(v){

 alert(v.field+"--"+v.message);

})

 

Ext.apply(Ext.data.validations,{

     ageMessage:'数据出现了错误',

      age:function(config,value){

          var min=config.min;

          var max=config.max;

          if(value> min && value<max){

               return true;

           }

      }

})

 

三、数据代理 proxy

Ext.define('person'{

        extend:'Ext.data.Model'

         fields:[

              {name:'name',type:'auto'},

              {name:'age',type:'auto'},

         ],

         proxy:{

                type:'ajax',

                 url :'person.jsp',

                

          }

    });

     var p=Ext.ModelMgr.getModel("person");

     p.load(10,{

            failure:function(record,operation){

 

            }

            

    });

四、一对多  多对一

 teacher !=> student

Ext.regModel("teacher",{

        fields:[

             {name:'teacherId',type:'int'},

               {name:'name',type:'int'}

         ],

        hasMany:{

                    model:'student',

                    name:'getStudent'，

                     filterProperty:"teacher_Id"

           }

});

 

Ext.regModel("student",{

        fields:[

             {name:'studentId',type:'int'},

               {name:'name',type:'int'},

                {name:'teacher_Id',type:'int'},

         ]

});

五：proxy ：增删改查

var date=[

    {name:'dxj',age:20}

];

  var memoryProxy=Ext.create("Ext.data.proxy.Memory",{

     date:data,

     model:'person'

});

 

memoryProxy.read(new Ext.data.Operation(),function(result){  //查

      var datas=result.resultSet.records;

        Ext.Array.each(datas,function(model){

 alert(model.get('name'));

});

 

});

 

userData.push({name:'newdxj'}); 

memoryProxy.update(new Ext.data.Operation({

     action:'update',

     data:userdata

}),function(result){  //查

    var datas=result.resultSet.records;

    Ext.Array.each(datas,function(model){

          alert(model.get('name'));

     });

 

});

 

六、布局

1、card布局