EXTJS - 技术教程文章
ExtJS ComboBox之 2级联动【代码】
Ext.onReady(function () { /*表格数据源绑定*/var menuStore = Ext.create(‘Ext.data.Store‘, { pageSize:10, fields: [‘id‘,‘‘,‘sm_name‘, ‘sm_url‘, ‘fatherGuid‘,‘fatherName‘], proxy: { type: ‘ajax‘, url: ‘/SystemManage/GetMenuList‘, reader: { type: ‘json‘, root:‘data‘, totalProperty:‘totalCount‘ } }, autoLoad: true });grid = Ext.create(‘Ext.grid.Panel‘, { store: menuStore, col...
[ExtJs] ExtJs4.2 数据模型Ext.data.Model学习【代码】
Model代表应用程序管理的一些对象。例如，我们可能会为 我们想在系统中建模的现实世界中的一些物体像使用者、产品和汽车等定义一个Model。这些Model在 Ext.ModelManager中注册，被Ext.data.Store使用, 而这些Ext.data.Store又被许多 Ext中许多与数据绑定的组件使用.直接上代码:<%--Created by IntelliJ IDEA.User: AdministratorDate: 2015/12/13 0013Time: 08:51To change this template use File | Settings | File Templates. -...
跟我一起学extjs5(28--加入模块和菜单定义[1建立数据库和表])【图】
跟我一起学extjs5(28--加入模块和菜单定义[1建立数据库和表]) 下面我们开始进入自定义系统的设计和各个组成部分的搭建工作。 首先在sql server中建立数据库，这里的数据的名字我定义为extjs5，然后需要建立模块的定义表，这个表里将存着系统中所有模块的定义信息。为了能有个直观的前后台的互动，先把模块和菜单这二个部分加进去，可以把菜单数据组织好后发送到前台去进行展示。 由于系统中的模块很多，需要分...
ExtJS的4.1新特性简要介绍
ExtJS的4.1新特性简要介绍一、动态加载机制 Ext.require动态加载任何类，并且会加载依赖类；二、新类系统 ?类定义：ExtJS4.0以后应入了Ext.define方法，他通过类的字符串进行定义和继承类，类管理器会自动检测类之间的依赖关系；取消了4.0版本之前的严格加载顺序机制。 ?Mixins：类似于多继承，是一种细粒度的代复用单元，它定义了一套可重用的行为和配置，如果一个类需要某个特性，只需要将特性混入目标类即可。三、St...
一、ExtJS下载使用【图】
ExtJS下载4.1 版本: http://www.sencha.com/products/extjs/download/ext-js-4.1.1/16833.4 版本:http://www.sencha.com/products/extjs3/download/ext-js-3.4.0/203ExtJS-3.4文档目录ExtJS-3.4.0文档目录说明：? adapter目录下是EXT的核心代码和底层库，包括jQuery、Prototype和YUI的适配器。? docs目录下是EXT的文档。? examples目录下是官方的演示示例。? pkgs目录下是EXT压缩后的代码，经过压缩的代码体积更小，加载更快。? r...
利用ExtJS导出Excel【代码】【图】
Ext.ns("Msp.Component");//config = { // fileName : "净值及头寸核对", // exportDate : "2014-01-20", // dataSource : [ // {grid : grid1, param : param1, showType : true}, // {grid : grid2, param : param2, showType : false} // ], // hiddenColumnArr : ["assetName"], // isMail : true, // filePath : "C:\\mspMail\\" //} Msp.Component.PageToExcel = function(config){this....
Extjs-工具条和菜单 Ext.menu和Ext.Toolbar
转载自：http://blog.csdn.net/itlwc/article/details/78780021.创建一个简单工具条效果图[javascript] view plaincopy <script type="text/javascript" defer> Ext.onReady(function(){ // 创建带三个按钮的工具条 var tb = new Ext.Toolbar({ width : 300, items : [{ text: ‘新建‘ },{ text: ‘修改‘ },{ ...
Extjs DateTime 日期时间选择控件 （非点击日期强制选择） 支持4.0以上【图】
Extjs的日期控件，只能支持到日期选择，对时间的选择并不完善。而网上下载的控件，都是基于Ext.form.dateField 开发，在选中日期后自动选择，并隐藏此选择窗口。在经过一番改造后，终于做好了一个带确认按钮的时间选择控件。截图如下 具体代码在附件里。 要想正常使用，还需要加一段css样式：.x-datepicker-sel { border-color: rgb(224, 162, 162); border-style: solid; border-width: 1; }用于上面的选中的样式。添加到自己引用...
Extjs 下拉框没有数据【图】
Extjs框架的下拉框动态加载数据时不显示数据。 1，返回结果的键值和下拉框定义的不一致 如下定义的下拉框值为value，显示为text 返回结果也必须是这种格式，不一致就会出错。 2，定义下拉框时多了个逗号 这种情况下在ie9浏览器下出错，在ie11，谷歌浏览器不出错. 所以，一定要注意最后一项的逗号使用。。原文：http://blog.csdn.net/lishuangzhe7047/article/details/40428063
ExtJS4.2 Grid知识点七：显示行号、斑马线效果（奇偶行背景色不一致）、复制单元格文字、禁止点击列排序【代码】
本节主要学习ExtJS4.2 Grid显示行号、斑马线效果（奇偶行背景色不一致）、复制单元格文字、禁止点击列排序、禁止列头部右侧菜单，示例图片：在线演示 / 在线演示主要内容如下：显示行号斑马线效果（奇偶行背景颜色不一致）复制单元格问题禁止点击列排序禁止列头部右侧菜单1.显示行号在Grid中增加行号列，xtype指定为rownumberer。{header: ‘NO‘,xtype: ‘rownumberer‘,width: 40,sortable: false}2.斑马线效果（奇偶行背景色不...
ExtJS 4.2 Grid组件的单元格合并【代码】【图】
ExtJS 4.2 Grid组件本身并没有提供单元格合并功能，需要自己实现这个功能。 目录1. 原理2. 多列合并3. 代码与在线演示 1. 原理1.1 HTML代码分析首先创建一个Grid组件，然后查看下的HTML源码。1.1.1 Grid组件1.1.2 HTML代码从这些代码中可以看出，Grid组件可分为grid-header和grid-body 两块区域(若含有工具栏和分页栏，它们都会含有各自的独立区域)。其中grid-body包含了许多tr元素，每一个tr都是代表Grid组件中的一行数据；每个tr...
[ExtJS5学习笔记]第二十二节 Extjs5中使用beforeLabelTpl配置给标签增加必填选项星号标志【图】
本文地址：http://blog.csdn.net/sushengmiyan/article/details/39395753官方例子: http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.form.Labelable-cfg-beforeLabelTpl本文作者：sushengmiyan------------------------------------------------------------------------------------------------------------------------------------在注册页面获取填写信息的界面，我们都能看到必填选项的标志* 这个东西。在Ext中，我们可...
ExtJS 4学习【代码】【图】
主要是选自《Ext js 权威指南》描述的是Extjs4的版本模板代码如下：（略有改动，原因是当前文件目录下放置了extjs的包）<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><html><head><title></title><link rel="stylesheet" type="text/css" href="./extjs/resources/css/ext-all.css"/><script type="text/javascript" src="./extjs/bootstrap.js"></script><script type="text/jav...
ExtJs弹出窗口【代码】
1、Ext.Msg.alert(String title, String msg, [Function fn], [Object scope])显示一个标准的带有一个“确定”按钮的只读消息框（类似于基本的JavaScript警告提示）。参数：title : 标题msg : 提示消息fn : 消息框关闭后调用的回调函数scope : 回调函数被执行的范围(this 引用，默认指向window)eg:1 Ext.Msg.alert("提示", "没有可归档的文件"); 2 Ext.Msg.alert("提示", "没有可归档的文件", function () { 3 alert("提示框关...
ExtJs--04--window窗口属性说明并两种方式添加子组件
Ext.onReady(function(){ /** extjs 容器组件的layout属性可以设置它的显示风格，以下视情况选用： - Auto - **默认** - hbox //水平方向排列 - vbox //垂直方向排列1)absolute:在容器内部，根据指定的坐标定位显示。 2）accordion:手风琴效果。 3）anchor: 注意以下几点：1.容器内的组件要么指定宽度，要么在anchor中同时指定高/宽2.anchor值通常只能为负值（指非百分比值），正值没有意义。3.anchor必须为字符串值 4) border :将...
[extjs(1)] extjs第一个组件treepanel【代码】【图】
刚刚在接触extjs这个前段插件，由于公司是用这个来做前段的，所以有必要花点时间来掌握一下，下面是我自己的非常浅的学习总结，后期会慢慢添加的！！ 一、TreePanel基本配置参数: animate:true//展开,收缩动画,false时,则没有动画效果 autoHeight:true//自动高度,默认为false enableDrag:true//树的节点可以拖动Drag(效果上是),注意不是Draggable enableDD:true//不仅可以拖动,还可以通过Drag改变节点的层次结构(drap和...
extjs
自动生成行号，支持checkbox全选，动态选择显示哪些列，支持本地以及远程分页，可以对单元格按照自己的想法进行渲染，这些也算可以想到的功能。序言编辑功能丰富，无人能出其右。无论是界面之美，还是功能之强，ext的表格控件都高居榜首。单选行，多选行，高亮显示选中的行，拖拽改变列宽度，按列排序，这些基本功能ExtJS轻量级实现。自动生成行号，支持checkbox全选，动态选择显示哪些列，支持本地以及远程分页，可以对单元格按照...
Extjs6 带有filefield 的form 对相应的处理不常规问题分析
我在使用extjs的时候对Ext.Ajax的requestexception事件进行处理,统一处理一下请求失败的相应(请求失败弹窗显示相应的404或500).但是今天出现了即使请求错误,但没有任何弹窗的情况,多次尝试后发现在包含filefield的form在submit的时候会出现这个情况(好大的一个坑!试了好久才试出来!)继续测试发现,这种情况下Ext.Ajax的requestcomplete事件中的response参数中的status永远为200即使请求失败,比如响应码为404,500时另外通常在Ext.Aja...
extjs5 常用属性的说明
uses -- 被引用的类可以在该类之后才加载.requires -- 被引用的类必须在该类之前加载.alias : 相当于别名一样,可以起多个,可以通过xtype创建实例，我现在接触的有三种类型,根据不懂的类型用不同的前缀 1. widget 使用(widget.test 组件) 2. viewmodel (viewmodel.test) 3. controller (controller.test) 原文：http://www.cnblogs.com/shaoshao/p/4119157.html
js以字符串方式创建DOM（原生js，jquery，extjs）【代码】
原生js <script type="text/javascript">var divHtml=‘<div>‘+‘<ul>‘+‘<li>‘+‘<a href="#">something added</a>‘+‘</li>‘+‘</ul>‘+‘</div>‘;var div=document.createElement(‘div‘);div.innerHTML=divHtml;document.body.appendChild(div);var li=div.getElementsByTagName(‘li‘)[0];console.log(li);</script> jquery实现 原文：http://www.cnblogs.com/byronvis/p/4742708.html
通过CSS样式来修改ExtJS:TreePanel的小图标
写在html<head>标签里面， 复制代码代码如下:<style type="text/css"> .x-tree-node-collapsed .x-tree-node-icon { background:transparent url(web/css/images/default/tree/1.gif); } .x-tree-node-expanded .x-tree-node-icon { background:transparent url(web/css/images/default/tree/drop-no.gif); } .x-tree-node-leaf .x-tree-node-icon{ background:transparent url(web/css/images/default/tree/2.gif); } </style> 原...
学习ExtJS table布局
一、Table布局由类Ext.layout.TableLayout定义，类以于html中的table，可以对行或列进行合并。 layoutConfig使用columns指定父容器分成3列， rowspan合并行数目。 colspan合并列数目。 二、应用举例 代码如下:Ext.onReady(function(){ var _panel = new Ext.Panel({ title:"人员信息", renderTo:Ext.getBody(), width:500, height:200, layout:"table", layoutConfig: { columns: 3 }, items:[{title:"子元素1",html:"这是子元素1...
javascript – Extjs ajax代码重构【代码】
我有这种ajax代码重复了很多地方.如何将其重构为单个方法,以便在成功或失败时仍允许不同的行为.Ext.Ajax.request({url : 'ajax.php' , params : { action : 'getDate' },method: 'GET',success: function ( result, request ) { Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText); },failure: function ( result, request) { Ext.MessageBox.alert('Failed', result.responseText); } ...
解析Extjs与php数据交互(增删查改)_PHP
代码如下://搜索暂时没做，数据是出来了，但是却没法显示Index.php文件 代码如下:header("Content:text/html;charset=utf-8");$link = mysql_connect("localhost","root","123456")or die('error'.mysql_error());mysql_select_db("stu",$link);mysql_query('set names utf8');$sql = "select count(*) num from men";$num = mysql_query($sql);$count = mysql_fetch_array($num);$start = $_POST['start'];$limit = $_POST['limit...
javascript – Extjs：如何更改树节点属性？【代码】
如何更改树节点的属性？ 一个树节点具有以下属性：{"id":"75", "description":"My Tree Node", "status":"25" "uiProvider":"col", "leaf":true}现在我的脚本收到以下数据{ "id":"75", "status":"100", "cls":"done" }我尝试更新属性(UPDATED)：// a.result.data has the new data and taskID is the node's id for (var property in a.result.data) { tree.getNodeById(taskID).attributes[property] = a.result.data[property]; ...
ExtJs使用总结(非常详细)
一、获取元素（Getting Elements） 1.Ext.get var el = Ext.get('myElementId');//获取元素，等同于document.getElementById('myElementId');//会缓存 2. Ext.fly var el = Ext.fly('myElementId')//不需要缓存。 注：享元模式（Flyweight Design Pattern）是一种节省内存的模式，该模式的大概原理是建立单个全体对象然后不断反复使用它。 3.Ext.getDom var elDom = Ext.getDom('elId'); // 依据id来查dom节点 var elDom1 = Ext.ge...
ExtJs使用IFrame的实现代码【图】
环境： Microsoft Visual Studio 2008 Sp1 Asp.net MVC ExtJs 3.1.1 使用IFrame须要一个ExtJS的一个插件ManagedIFrame（miframe.js），用了这个插件可以使用 xtype:'iframepanel' 下载 代码段： 代码如下:var p_center = new Ext.TabPanel({ region: "center", resizeTabs: true, // turn on tab resizing minTabWidth: 115, tabWidth: 135, enableTabScroll: true, width: 600, activeTab: 0, height: 250, items:[{ xtype: ifra...
学习ExtJSWindow常用方法_extjs
一、属性 plain：布尔类型，true表示强制与背景色保持协调，默认值为false。 resizable：布尔类型，用户是否可以调整窗体大小，默认值为true表示可以调整大小。 maxinizable：布尔类型，true表示显示最大化按钮，默认值为false。 maximized：布尔类型，true表示显示窗体时将窗体最大化，默认值为false。 closable：布尔类型，true表示显示关闭按钮，默认值为true。 bodyStyle：与边框的间距，如：bodyStyle:"padding:3px"。 button...
ExtJS 下拉多选框lovcombo
开始以为很简单，在option里加个input checkbox就行了。哪知行不通，网上搜了一些实现方法，主要是用div层来模拟下拉。本想照着这种思路，再结合这个项目具体应用自己写一个，发现太麻烦了。刚好在另外一个项目中使用extjs，找到了一个扩展lovcombo，学习了一下它自带的例子（配合2.3版的extjs，3.x版的貌似有问题）。例子倒不难，关键是要把它添加到现有的代码中，并且尽量少的改动原有代码。 下拉多选框的使用过程中处理比较多的...
ExtJS如何设置与获取radio控件的选取状态_extjs
获取 代码如下: function IsChecked(radioId) { return Ext.getCmp(radioId).checked; } 设置 代码如下: function SetRadio(radioId, isChecked) { Ext.getCmp(radioId).setValue(isChecked);//或者setValue("on")也可以设置为选中 }