Ext.require:用到哪些组件,然后就预先加载,多余不用加载的组件 在实际环境中我们都会用 ext-all.js, 但是在开发调试的时候,我们使用 require 的话它可以动态加载单个的 js 文件,便于我们定位错误. 意思就是这个页面需要用到哪些组件,然后就预先加载,多余不用加载的组件就不管他了.提高运行速度 比如,在脚本刚开始写上如下代码: Ext.require([     'Ext.tab.*',     'Ext.window.*',     'Ext.tip.*',    

接上面的船舶管理业务,这里介绍添加和修改操作. 目录 1. 添加操作 2. 修改操作 3. 在线演示 1. 添加操作 1.1 创建AddShipWindow.js 在业务中的view目录下创建一个AddShipWindow.js文件,表示一个增加船舶的窗口组件. 此文件中包含了一个form组件用于显示所要添加的字段:船舶名称.状态.吨数和核载人数. 具体代码如下: Ext.define('App.ShipMgr.view.AddShipWindow', { extend: 'Ext.window

也已经写了很久时间的extjs ,每次都用到很多的combobox,配置很多东西觉得实在是太麻烦,所以根据常用到的情况写了一个简便的combobox,再次记录下来,以免放在某个地方忘记了找不到了. 定义一个基本的baseCombobox类,如下. Ext.define('Admin.view.baseCmp.BaseCombobox', { extend: 'Ext.form.field.ComboBox', xtype: 'baseCombobox', editable: false, lab

最近由于业务需要,研究了一下Sencha ExtJS 6 ,虽然UI和性能上据相关资料说都有提升,但是用起来确实不太顺手,而且用Sencha cmd工具进行测试和发布,很多内部细节都是隐藏的,出了问题不好跟踪.更奇葩的是明明在sencha app watch上运行很好,但是sencha app build后会出现异常.即使是这样,但Sencha ExtJS 6 在UI控件和编程模式上确实比较强大.下面介绍一个 Widget Grid 用法,可以在表格grid中进行列样式渲染,是一个比较强大的功能

概述 1.ExtJS 5不支持日期选择框中只选择年月,为了满足ExtJs5可以实现选择年月的功能,查询网上资料,整理出来了相应的处理方式,最终实现的效果如下图: 2.ExtJS 控件丰富,如果需要实现下拉列表控件ComboBox中含有Check样式的皮肤,只需要在ComboBox控件中监听相应的下拉事件和选择事件即可.实现的效果如下: 日历控显示年月的实现方式 1.编写ext-extendmonth.js,代码内容如下 Ext.define('Ext.form.field.Month', { e

Extjs Mvc模式下的整个MVC框架体系即下图: 包含了Controller(实现方法层),Store(数据来源管理层),View(页面布局层).之所以用MVC我想是因为减轻针对某一页面的单一的JS 的开发,为啥呢,可以看一下没有使用MVC模式的Extjs 的编码: (因为我也是新手,所以可能里面的代码有点儿冗杂) 仅仅是一个页面,代码量已经上了千行以上,可想而知,对于功能复杂的页面如果用单一的Extjs UI开发的话 代码量肯定可烦人(最主要是翻来翻去的,鼠标滚轮都烦了...).而且如果你

extJs代码: <script src="build/ext-all.js"></script> <script src="build/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script> <link rel="stylesheet" href="build/packages/ext-theme-crisp/bui

前言: 我之前是搞EasyUI+KO.js的,由于最近项目需要用到ExtJs.因此.边学边记录我的学习历程,希望能给自己和大家一点帮助. 1.0什么是ExtJs? 首先,什么是ExtJs呢?ExtJs主要用来开发富客户端的AJAX应用,主要用于创建前端用户界面,与后台技术无关的前端ajax框架.因此,可以把ExtJS用在.Net.Java.Php等各种开发语言开发的应用中.ExtJs最开始基于YUI技术,由开发人员 JackSlocum开发,通过参考JavaSwing等机制来组织可视化组件,无论

The Tree Panel Component is one of the most versatile Components in Ext JS and is an excellent tool for displaying heirarchical data in an application. Tree Panel extends from the same class as Grid Panel, so all of the benefits of Grid Panels - feat

一.ExtJs 4.x MVC模式的原理与作用 大规模客户端应用通常不好实现不好组织也不好维护,因为功能和人力的不断增加,这些应用的规模很快就会超出掌控能力,ExtJS4带来了一个新的应用架构,不但可以组织代码,还可以减少实现的内容. 新的应用架构遵照一个类MVC的模式,模型(Models)和控制器(Controllers)首次被引入.业界有很多种MVC架构,基本大同小异,ExtJS4的定义如下: a.Model模型:模型是字段和它们的数据的集合,例如User模型带有username和passw

写写就发现,有些代码不查查源头,不明白是怎么回事?搜到这篇文章觉得还是收益匪浅,更容易读懂代码. Classes in Ext JS 4: Under the hood Countdown to Ext JS 4: Dynamic Loading and New Class System[官网] 整理如下: 简单回顾一下,新的Class System (类系统),使我们能够这样定义类: Ext.define('Ext.Window', { extend: 'Ext.Panel', require

开发环境 eclipse(indigo) ExtJS4.0 开发目标 使用store.model和controller创建菜单树 开发步骤 之前我们已经建立了一个MVC的项目框架.现在要做的就是在这个基础上给项目添加一个左侧菜单. 首先,在/app/中定义一个菜单视图类TreeMenu.js: Ext.define('demo.view.TreeMenu', { extend: 'Ext.tree.Panel', alias: 'widget.treemenu', title: '系统菜单',

开发环境: ExtJS4.2 eclipse indigo 开发目标  搭建项目框架,创建viewport 开发步骤说明 这次主要使用extjs4的mvc模式创建viewport.籍此初步了解mvc模式的结构. 下图为项目结构: 重点是app的目录结构: 其中controller.model.store.view一般来说是必须存在的目录. app.js是应用的引导页.需要在首页中显式调用. 如下是index.jsp的代码: 1: <%@ page language="java"

升级到 ExtJS 5的过程记录   最近为公司的一个项目创建了一个 ExtJS 5 的分支,顺便记录一下升级到 ExtJS 5 所遇到的问题以及填掉的坑.由于 Sencha Cmd 的 sencha app upgrade 命令无法正常地讲项目升级至 ExtJS 5 (或许是方式不对) ,所以我的做法是新建一个 ExtJS 5 的项目,然后把 app 包拷贝过去,然后慢慢修复报错的东西,直到项目可以正常跑起. 说在前面: 升级的项目目前是一个十分初级的版本,代码量很少,只有导出报表和 dash

大规模客户端应用通常不好实现不好组织也不好维护,因为功能和人力的不断增加,这些应用的规模很快就会超出掌控能力,ExtJS 4 带来了一个新的应用架构,不但可以组织代码,还可以减少实现的内容新的应用架构遵照一个类MVC的模式,模型(Models)和控制器(Controllers)首次被引入.业界有很多种MVC架构,基本大同小异,ExtJS 4的定义如下: Model模型 是字段和它们的数据的集合,例如User模型带有username和password字段,模型知道如何持久化自己的数据,并且可以和其

项目目录结构 (源码)2. app.js Ext.Loader.setConfig({ enabled : true, paths : { 'Ext' : 'extjs', 'App' : 'app', 'Ext.ux' : 'extjs/ux' } }); Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; Ext.require('Ext.container.Viewport'); Ext.applicatio

1.Extjs MVC开发模式 在JS的开发过程中,大规模的JS脚本难以组织和维护,这一直是困扰前端开发人员的头等问题.Extjs为了解决这种问题,在Extjs4.x版本中引入了MVC开发模式,开始将一个JS(Extjs)应用程序分割成Model-View-Controller三层,为JS应用程序的如何组织代码指明了方向,同时使得大规模JS代码变得更加易于重用和维护:这就是Extjs MVC开发模式的初衷. 在官方给出的MVC例子中,我们可以看到一个简单的列表编辑功能,这篇文章就围绕这个功能进行

主要参考的是官方文档 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>主播推荐-分数管理-标签管理</title> <link rel="stylesheet" type="text/css" href="resources/css/ext-all.

这是 CNX 公司在开发 ExtJS 项目中总结的需要特别注意的 10 个地方.有时候,我们完全是自己使用 ExtJS 从零开始构建的新的应用程序,但有时候我们的客户会要求我们使用他们自己的代码,并且帮助他们提高性能.解决bug以及结构上的问题.同时,我们已经在 ExtJS 项目中作为“清洁者”的角色工作相当长的一段时间了,开始注意到项目中经常会出现一些很值得优化的代码,而这些情况不仅仅只在我们的项目中出现,也会经常出现在其他开发者的代码中.基于过去几年对我们自己工作的总结,我们想应该把这些经验

MVC的模式,模型(Models)和控制器(Controllers) Model模型 是字段和它们的数据的集合,例如User模型带有username和password字段,模型知道如何持久化自己的数据,并且可以和其他模型关联,模型跟ExtJS 3 中的Record类有点像(区别是,Record只是单纯的扁平结构,而Model可以nest),通常都用在Store中去展示grid和其他组件的数据 View视图 是组件的一种,专注于界面展示 - grid, tree, panel 都是view Con

Ext JS 入门指南 前言 本来我是打算自己写一个系列的 ExtJS 6 学习笔记的,因为 ExtJS 6 目前的中文学习资料还很少.google 搜索资料时找到了一本国外牛人写的关于 ExtJS 6 的电子书 [Ext JS 6 By Example].这份资料在 PACKT 上卖 35.99 刀的,当然了万能的 google 还是帮我下载到了 PDF 文档.大概看了一下,讲的很详细,例子也比较简单,容易理解,现我准备利用工作之余翻译这份文档,为自己学习加深理解,也希望能帮助更多的人学习.