zoukankan      html  css  js  c++  java
  • extjs4学习日志(2)数据模型中的model

    今天继续学习extjs4,今天主要学习extjs的数据模型结构主要包括model、proxy和store,分别代表模型、代理、数据集

    1、  创建model

           model的创建过程就相当于数据库中的设计table的过程和C#中的class的定义过程

           两种方法:

           a) Ext.define():自定义一个类并继承自Ext.data.Model类

    1             //方法1:使用Ext.define创建model类
    2             Ext.define('person', {
    3                 extend: 'Ext.data.Model',   //继承自model类
    4                 fields: [                   //相当于table中的字段,class中的属性
    5                     { name: 'name', type: 'auto' },
    6                     { name: 'age', type: 'int' },
    7                     { name: 'email', type: 'auto' }
    8                 ]
    9             });

           b) Ext.regModel():直接定义一个类,返回的就是model类

    1             //方法2:使用Ext.regModel来创建model类,可以不写继承自model类,本身就返回一个model
    2             Ext.regModel('user', {
    3                 fields: [
    4                     { name: 'name', type: 'auto' },
    5                     { name: 'age', type: 'int' },
    6                     { name: 'email', type: 'auto' }
    7                 ]
    8             });

    2、  实例化model类

           a) new关键字

    1             //方法1:new关键字
    2             var p = new person({
    3                 name: '张三',
    4                 age: 26,
    5                 email: 'zs@163.com'
    6             });
    7 
    8             Ext.Msg.alert('提示', '姓名:' + p.get('name') + ' 年龄:' + p.get('age') + ' 邮箱:' + p.get('email'));

      获取model中的字段可以用对象.get(字段名)来获得。

      b) Ext.create()

    1 //方法2:Ext.create()(推荐)
    2             var p1= Ext.create('person', {
    3                 name: '李四',
    4                 age: 30,
    5                 email: 'ls@163.com'
    6             });
    7 
    8             alert('姓名:' + p1.get('name') + ' 年龄:' + p1.get('age') + ' 邮箱:' + p1.get('email'));

      c) Ext.ModelManager.create()

    1     //方法3:Ext.ModelManager.create()可以简写成Ext.Mgr.create()
    2     var p2 = Ext.ModelMgr.create({
    3         name: '王五',
    4         age: 35,
    5         email: 'ww@163.com'
    6     }, 'person');
    7 
    8     alert('姓名:' + p2.get('name') + ' 年龄:' + p2.get('age') + ' 邮箱:' + p2.get('email'));

    4、  验证器validations

      就是对model的对象的各个字段(属性)进行验证的机制

     1  //扩展验证机制
     2     Ext.apply(Ext.data.validations, {
     3         age: function (config, value) {
     4             var min = config.min;
     5             var max = config.max;
     6             if (value >= min && value <= max) {
     7                 return true;
     8             }
     9             else {
    10                 return false;
    11             }
    12         },
    13         ageMessage: '年龄数据出现错误!'
    14     });
    15 
    16     //定义名为person的model
    17     Ext.regModel('person', {
    18         fields: [
    19             { name: 'name', type: 'auto' },
    20             { name: 'age', type: 'int' },
    21             { name: 'email', type: 'auto' }
    22         ],
    23         //验证器
    24         validations: [
    25         //验证类型:长度验证  验证字段:name 长度大于等于2小于等于6
    26             {type: 'length', field: 'name', min: 2, max: 6 },
    27         //验证年龄必须在0到100之间
    28             { type: 'age', field: 'age', min: 0, max: 100 }
    29         ]
    30     });
    31 
    32     var p = Ext.create('person', {
    33         name: '王',
    34         age: -9,
    35         email: 'ls@163.com'
    36     });
    37 
    38     var errors = p.validate();
    39 
    40     errors.each(function (msg) {
    41         alert('字段:' + msg.field + '\n发生错误:' + msg.message);
    42     })

    运行结果将会输入错误信息。

  • 相关阅读:
    英语范文——人的名字的重要性
    英语写作常用句型
    英语范文——构建绿色校园
    OpenGL实例:三角形
    Python+Selenium笔记(二):配置谷歌+IE环境
    Python+Selenium笔记(一):环境配置+简单的例子
    Python笔记(八):web开发
    Python笔记(七):字典、类、属性、对象实例、继承
    Python笔记(六):推导数据
    Python笔记(五):异常处理和数据存储
  • 原文地址:https://www.cnblogs.com/servant/p/2519268.html
Copyright © 2011-2022 走看看