ext

Ext数据组件之Store,Model

一笑奈何 提交于 2019-11-28 14:12:20
版本:5.1.0 说在前面:多个Model通常和一个Store配合使用。Store是多个record的集合(record是model的实例)。 举个例子:Store最终是要服务于Ext的组件的,就比如多选框(combobox)和网格(grid)。那么,store是怎么给组件提供服务的呢,见代码: 1. combobox: 'use strict'; Ext.onReady(function(){ var states = Ext.create('Ext.data.Store', { fields: [//要注意的是,Store的会根据fields里的元素自动创建Model。 //fields可以为空,Ext会根据数据的字段名,自行创建model // 'abbr', 'name' ], data : [//准备的内联数据,可以内联,也可以请求获取,这里只做一个例子。 {"abbr":"AL", "name":"Alabama"}, {"abbr":"AK", "name":"Alaska"}, {"abbr":"AZ", "name":"Arizona"} //... ] }); //上方的Store会根据fields创建一个类似这样的model Ext.define('MyComboModel', { extend: 'Ext.data.Model', fields: [ /

ExtJS组件window

爱⌒轻易说出口 提交于 2019-11-28 14:01:39
版本:5.1.0 Ext.window.Window xtype:window 调用用法和MessageBox类似,在后面加show方法。 Ext.create('Ext.window.Window', { title: 'Hello', height: 200, width: 400, layout: 'fit', items: { // Let's put an empty grid in just to illustrate fit layout xtype: 'grid', border: false, columns: [{header: 'World'}], // One header just for show. There's no data, store: Ext.create('Ext.data.ArrayStore', {}) // A dummy empty data store } }).show(); window的show函数同样可以传入参数,但是不像messageBox的那么多。 来源: https://www.cnblogs.com/oy-lee/p/11410070.html

JQuery 和 Extjs 比较

久未见 提交于 2019-11-28 12:20:21
JQuery 和 Extjs 比较 一、JQuery 和 Extjs 比较 JQuery-EasyUI是仿照Ext做的。 Ext框架是一个整体,面向对象的编程思想,每个控件之间可以相互通讯。JQuery的控件全都是分散的,没有整体性可言。单独拿出来一个控件就能用。 Ext有一定学习曲线,不像EasyUI就那么几个简单的API完事儿了。 如果你要开发系统应用的话,首选Ext不会错的,控件库丰富,扩展和维护都方便。如果是简单的页面动画和效果,JQuery-EasyUI足够。 jquery-EasyUI只是一个工具库,比较简单,相对容易。 Ext是一套真正的ria开发框架,甚至可以实现桌面应用一样的强大功能。本身代码质量高,而且是高度的面向对象设计的。jQuery-EasyUI 入门相对容易一些,实际用的过程中要用到各种插件,基本上用一个“学”一个, ExtJS 入门稍难. 二、内容介绍: 1、什么是ExtJS: ExtJS可以用来开发RIA也即富客户端的AJAX应用,是一个用javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的前端ajax框架。因此,可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。ExtJs最开始基于YUI技术,由开发人员JackSlocum开发,通过参考JavaSwing等机制来组织可视化组件

Ext.form.Label组件动态设置html值

眉间皱痕 提交于 2019-11-28 07:56:47
解决方法: (1)用的是 Ext.getCmp(id).setText('XXXX')可以动态设置label 显示的文本值,但是文本中有个别数字需要改变颜色显示,需要加样式,这种方法会把加样式的标签(html)以文本的方式显示出来,而不会被浏览器解析。。。 (2) Ext.getCmp(id).getEl().update('XXXXX'),将要显示的文字和样式代码写到update()方法中即实现动态设置html的显示 动态调用代码: var b = window.unitCount == undefined ? 0 : window.unitCount; Ext.Ajax.request({ url: "url", asynchronous: false, success: function (response) { //debugger var data = response.responseText; // data = Ext.decode(data); var result = eval("(" + data + ")"); if (result.num0 != "") { // var count = result.num0 + result.num1 + result.num3; // debugger // a.setText("已选择" + b + "个单位,共"

vue 获取视频时长

别等时光非礼了梦想. 提交于 2019-11-27 23:54:49
参考资料: js获取上传音视频文件的时长 直接通过element-ui自带的上传组件结合js即可,代码如下: HTML: <el-upload class="upload-demo" :action="actionUrl" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"> <button class="ce-button not-hover primary"> <i class="ce-icon_upload"></i> <span>重新上传</span> </button> </el-upload> js: beforeAvatarUpload(file) { var fileName = file.name || '' var ext = fileName.split('.')[fileName.split('.').length - 1] if (ext !== "doc" && ext !== "docx" && ext !== "xls" && ext !== "xlsx" && ext !== "ppt" && ext !== "pptx" && ext !== "pdf" && ext !== "mp4") { this.

ExtJS学习

江枫思渺然 提交于 2019-11-27 23:50:58
ExtJS是一门比较纠结的框架,自己不太熟,因为现在在做一些老项目,所以没办法要学点。记录下。其实Ext也不是很难,主要是多查查API,了解其基本的用法,然后慢慢去学习,学成之后做管理系统还是很有优势的,当然,5.0版本和3.0版本还是有很大区别的。 Ext JS 5现在支持以下浏览器: IE8+ (只支持标准模式) Firefox 12+ (PC & Mac) Safari 6+ Chrome 18+ Opera 12+ (PC & Mac) 目录介绍 这是 目前最新版的 ExtJS5.1.0 版本,下载解压出来的文件如下: http://docs-origin.sencha.com/extjs/5.1/5.1.0-apidocs/ 这个地址是ExtJS的API地址。 build :压缩后的Ext全部源码(分类存放) 目录下截图如下: ext-all.js :压缩后的Ext全部源码,包含了ExtJS的所有控件 ect-debug.js :用于开发错误提示 ext-all-debug.js :压缩的debug.js,报错的时候会详细一点(开发的时候不用,因为出错不好定位) package :Ext提供的常用控件、主题和语言包 目录截图如下: 我们先找到本地化语言包, ext-locale 包是本地化语言包,我们只保留里面的 ext-locale-zh_CN.js(在ext-5.1

Ext.container.Container

谁说我不能喝 提交于 2019-11-27 16:54:05
任何可能包含其它Ext.Component组件的基类。 容器对于所包含的组件的基本处理包括添加,插入和删除项目。 包含Ext.Component,又是其他容器的基类 Ext.container.Container Ext.create('Ext.container.Container', { renderTo: Ext.getBody(), }); <div class="x-container x-container-default x-border-box" id="container-1009">  <div id="container-1009-outerCt" data-ref="outerCt" class="x-autocontainer-outerCt" role="presentation" style="width: 100%; table-layout: fixed;">    <div id="container-1009-innerCt" data-ref="innerCt" style="" class="x-autocontainer-innerCt" role="presentation">    </div>  </div></div> items:单个组件,或者是以数组形式定义的子组件集合 将会自动添加到容器中去,是组建容器管理其他组建的属性

转:ext的xtype值

跟風遠走 提交于 2019-11-27 09:44:12
基本组件: xtype Class 描述 button Ext.Button 按钮 splitbutton Ext.SplitButton 带下拉菜单的按钮 cycle Ext.CycleButton 带下拉选项菜单的按钮 buttongroup Ext.ButtonGroup 编组按钮(Since 3.0) slider Ext.Slider 滑动条 progress Ext.ProgressBar 进度条 statusbar Ext.StatusBar 状态条,2.2加进来,3.0 又去了 colorpalette Ext.ColorPalette 调色板 datepicker Ext.DatePicker 日期选择面板 容器及数据类组件 xtype Class 描述 window Ext.Window 窗口 viewport Ext.ViewPort 视口,即浏览器的视口,能随之伸缩 box Ext.BoxComponent 盒子组件,相当于一个 <div> component Ext.Component 组件 container Ext.Container 容器 panel Ext.Panel 面板 tabpanel Ext.TabPanel 选项面板 treepanel Ext.tree.TreePanel 树型面板 flash Ext.FlashComponent 显示

Dijit、ExtJS、jQuery UI 异同浅析

蓝咒 提交于 2019-11-27 09:36:24
简介: 当今,各类 JavaScript 框架在前端开发中已经相当普及。Dojo、Ext jQuery 等主流 JavaScript 框架不仅提供了一系列核心 API 来屏蔽浏览器差异,简化 DOM 操作、增强 JavaScript 原生 API,还为用户提供了丰富的 UI 控件库来帮助进行敏捷 Web 开发。然而由于各个框架的核心 API 的设计思路不尽相同,其 UI 控件的架构设计也各具特色。您是否想要创建一个自己的 UI 控件,但面对这些框架,而不知如何取舍?您是否长期从事某一种框架的开发,没有时间研究别的框架,却又想了解同样的问题别人是怎么解决的?本文将为您介绍 Dijit、Extjs、jQuery UI 从使用方式到架构实现的异同,展现不同的设计思路,希望能为您带来帮助。 标记本文! 发布日期: 2012 年 2 月 16 日 级别: 中级 访问情况 : 1206 次浏览 评论: 1 ( 查看 | 添加评论 - 登录) 平均分 (15个评分) 为本文评分 Dijit、ExtJS、jQuery UI 简介 Dojo 是开源 JavaScript 库中起步较早的先行者之一。由 Alex Russell, David Schontzler, Dylan Schiemann 等人于 2004 年创立。Dojo 具有类似 Java 的包机制 (packaging system),