`
memory1897
  • 浏览: 6796 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

Extjs4 MVC 添加model层

阅读更多

 

PS:第一篇我放了个图片前台结构的,有个单词写错了导致我model层总是报错,我把model写成modal了。呵呵,粗心的后果就是花费更多的时间去弥补我的粗心,这是被细心的人甩下的原因之一。

1、我们在model下的MVC.js文件中定义我们上一篇中grid的model,如下:

model
1 Ext.define('MVC.model.MVC', {
2     extend: 'Ext.data.Model',
3     fields: ['name', 'email']
4 });

2、在controller中声明我们定义的model,

models : ['MVC'],

  这样,我们的view层就能够使用定义的model了,接下来在view层中使用model,日常使用中一般都用于我门的store既数据请求的model的定义,这跟我们j2ee项目中的model是一个思想。把我们view中的store改成如下:

store
1 this.store = {
2             model : 'MVC.model.MVC',
3             data  : [
4                 {name: '张三',    email: 'zs@cnblogs.com'},
5                 {name: '李四', email: 'ls@cnblogs.com'}
6             ]

接下来运行项目,结果与我们上一篇一样。这样我们的整个项目的mvc就基本清晰了。我看了一下4的docs,发现MVC中我们可以把store单独拿出来,mvc也是可以识别的,但是我一般都是跟grid定义在一起,因为本身controller占据了我们大部分的代码,view层比较清晰,所以哪里定义的grid,store放哪里我跟人比较好管理。

以后再写的话主要会集中在一些使用的细节方面,比如panel数据整体的设置等等,这些都跟model千丝万缕。

总之,Extjs,Great Framework!对了,宣传一下sencha touch framework,很不错,手机端框架,有兴趣的可以了解一下!

分享到:
评论

相关推荐

    extjs4.2MVC去除Model层和Store层

    去除extjs4.2MVC中的Model层和Store层,使用工厂模式来创建Model层和Store层简化代码。

    EXTJS简单MVC实例

    只要将解压的文件直接放置到myeclipse的webroot下面,启动tomcat访问。简单的EXTJS mvc框架,设计 store,model,controller,view,window等等,同时展示了一些基本的点击显示、修改等等操作,需要的同学自行下载

    extjs4 mvc extjs

    是用extjs mvc写的,controller里面会配置model store view,然后mode和store的关系,相信大家也很清楚了,store里面会用到model,当然也可以不用,和原来的extjs3.x是一样的,用field来表示,其实是换汤不换药而已...

    Extjs4.0 mvc模式开发

    本工程采用ExtJs4.0 开发,采用mvc开发模式,分为controller view model store。

    ExtJs4.0 mvc 模式

    本实例采用Extjs4.0 开发,按照mvc模式分为,controller view model store

    ExtJS4中文教程2 开发笔记 chm

    ExtJS4学习笔记(十五)---Ext.data.Model ExtJS4学习笔记(十六)---Combobox三级联动 ExtJS4学习笔记(十四)--- ComponentQuery ExtJS4学习笔记(四)---Grid的使用 Extjs4开发笔记(三)——菜单的实现 Extjs4开发笔记(二)...

    MVC+Extjs架构WebMis自动生成

    系统可以产生IDAO、DAO、Model、Nhibernate映射文件、IBLL、BLL、Controller、DTO、Extjs、数据库、数据库表,这些都是一步到位的。 用户无需建立用户表、模块表、角色表、新闻发布表,这些系统都会自己建立的。

    Extjs6.0开发之mvvm与mvc的使用案例

    附件是我实际开发的一个模块,...ps:本模块共有3个模块,其中两个模块采用mvc,一个采用mvvm (因为觉得麻烦,所以model层没有划分很细,不过我个人比较喜欢这种开发方式,主要看controll和view model的设计思路)。

    免费 Extjs4.0教程视频

    第十二讲:extjs4.0的MVC重构十一讲中的grid(中) 第十三讲:extjs4.0的高级组建grid(下)列模式 第十四讲:extjs4.0的高级组件grid补充01选择模式selection和表格特性feature 第十五讲:extjs4.0的高级组件grid补充02...

    Extjs5.0从入门到实战开发信息管理系统(Extjs基础、Extjs5新特性、Spring、Spring mvc)

    Extjs5.0从入门到实战开发信息管理系统(Extjs基础、Extjs5新特性、Spring、Spring mvc、Mybatis),完整版,提供课件和代码下载! 本教程从Extjs5的开发环境搭建开始,讲解了Extjs5的项目结构(包括核心文件的作用...

    ExtJS(ajax框架) 4.2.1

    应用架构:在ExtJS 4,引入了一个标准化的几乎适合任何ExtJS应用程序的MVC风格的应用架构。使用MVC,开发团队只需要学习一种架构就能理解任何ExtJS 4的应用。 SDK工具:正在测试beta版的Sencha SDK工具,在第一版本...

    Extjs4.0视频教程和源代码,另附文档翻译

    第十二讲:extjs4.0的MVC重构十一讲中的grid(中) 第十三讲:extjs4.0的高级组建grid(下)列模式 第十四讲:extjs4.0的高级组件grid补充01选择模式selection和表格特性feature 第十五讲:extjs4.0的高级组件grid补充02...

    EXTJS4.0视频教程配套代码

    第十二讲:extjs4.0的MVC重构十一讲中的grid(中) 第十三讲:extjs4.0的高级组建grid(下)列模式 第十四讲:extjs4.0的高级组件grid补充01选择模式selection和表格特性feature 第十五讲:extjs4.0的高级组件grid...

    SpringMVC+ExtJS完美集成(数据传输方式为JSON和model)

    SpringMVC+ExtJS完美集成(数据传输方式为JSON和model),同时还支持controller页面配置、页面消息可配置(类似于国际化)、intercepter示例。

    Extjs教程源码

    第三讲: EXTJS4.0数据模型——Model 第四讲: EXTJS4.0的数据代理——Proxy 第五讲: EXTJS4.0的读写器Reader, Writer 第六讲: EXTJS4.0的数据集Store 第七讲: EXTJS4.0的事件机制Event 第八讲: EXTJS4.0的Ajax 第九讲...

    django-model2extjs:Model2extjs 是一个简单的 Django 应用程序,用于从 Django 模型生成 Extjs 代码(网格、表单和模型)

    Django-model2extjs 不会向您的项目添加任何数据库表。 生成的代码使用 Extjs MVC 详细文档位于“docs”目录中。快速开始从下载 zip 文件转到下载它的目录并像这样进行 pip 安装“pip install --user

    Learning ExtJS(PACKT,4ed,2015)

    The new version 5 is packed with new themes and the MVVM architecture that allows you to connect the model layer to the view and automatically update the model when the view is modified and vice ...

    Learning ExtJS, Fourth Edition (Ext JS 5+)

    Ext经典书籍的升级版,使用Ext JS 5,讲解了MVC、MVVM(Model-View-ViewModel) 模式,讲解的非常清楚,Ext JS 6 也适用

    Ext Js权威指南(.zip.001

    第1章 ext js 4开发入门 / 1 1.1 学习ext js必需的基础知识 / 1 1.2 json概述 / 3 1.2.1 认识json / 3 1.2.2 json的结构 / 3 1.2.3 json的例子 / 4 1.2.4 在javascript中使用json / 4 1.2.5 在.net中使用...

Global site tag (gtag.js) - Google Analytics