EXTJS - 技术教程文章

extjs 数字校园-云资源平台 2013.11.2--视频资源播放【图】

顺势做了mp3资源播放器后,接力做了这个视频资源播放器播放资源库中视频资源等于有了校园视频点播服务器可以关键词检索视频原文:http://blog.csdn.net/olinbsoft/article/details/18922631

Extjs 关于列column 排序问题

当我们在使用column属性时,添加sortable:true属性,该列本身应该是可以手动点击排序的,即API中所示:sortable : Boolean (可选)设置为true,此列允许排序。默认值为Ext.grid.ColumnModel.defaultSortable属性值。无论是本地/远程使用排序都是在Ext.data.Store.remoteSort中指定。但有的时候排序会无效,可能是在定义Ext.data.Store时添加了属性remoteSort:true,导致排序无效,去掉该属性即可。原文:http://blog.csdn.net/y6300...

extjs4 treepanel 多个checkbox先中 多个节点选中 多级节点展开【代码】

//<%@ page contentType="text/html; charset=utf-8" %>var checkedNodes = {_data:{},update:function(id,text,checked){if(checked){this.add(id,text,checked);}else if(!checked){this.delById(id);}},clear:function(){for(var key in this._data){ delete this._data[key];}this._data = {};},add: function(id,text){if(!this._data[id]){this._data[id] = {‘id‘:id,‘text‘:text};}},delById:function(id){if(this._dat...

EXTJS 4.2 资料 控件之Grid 那些事【代码】

最近在学习Extjs4.2 ,积累文章,看得不错,再此留年: //表格数据最起码有列、数据、转换原始数据这3项 Ext.onReady(function(){ //定义列 var columns = [ {header:‘编号‘,dataIndex:‘id‘,width:50}, //sortable:true 可设置是否为该列进行排序 {header:‘名称‘,dataIndex:‘name‘,width:80}, {header:‘描述‘,dataIndex:‘descn‘,width:112}, {header:‘状态‘,dataIndex:‘status‘,width:80,renderer:function...

基于Extjs的web表单设计器 第一节【图】

前面一节介绍了表单设计器的背景和最终的大概样式,本节主要介绍表单设计器的需求及功能设计。在讲需求之前先明确几个常用的概念:主表或者卡片表——具有多行多列的一个区域的控件块,如下图所示。明细表——就是常用的表格类型的控件块,表头信息就确立了该列的数据类型,如下图所示。卡片式的表:指的是一个表单模板只包括一个主表;主子表:指的是一个表单模板包含一个主表、一个明细表;多子表:指的是一个表单模板包含一个主...

extjs3 tree 指定内容qtip【代码】【图】

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <link href="resources/css/ext-all.css" rel="stylesheet"> <script src="jslib/ext-base.js"></script> <script src="jslib/ext-all.js"></script></head><body><script> function init(){ var tree = new Ext.tree.TreePanel({ renderTo: Ext.getBody(), useArrows: true, autoScroll: true, ...

ExtJS 细节【代码】

1. 如何防止每次点击同一个叶子节点时,都新开一个tab:var groupTree =Ext.create(‘Ext.tree.Panel‘,{//创件树 rootVisible:false, title :‘基准点设置‘, region :‘west‘,//useArrows: true, width :‘15%‘, border:false, animate :false, store:TreeStore, listeners :{ itemclick:function(tree,r,item,index,e,eOpts){var n = tab.getComponent(r.get(‘leaf‘));if(r.get(‘leaf‘)){if(...

ExtJs自学教程(1):从一切API开始【代码】

称号 记得 本系列文章是不是引进全套焦点ExtJs使用,您只需专注于解决ExtJs思考问题。人们不写长篇大论。别人能学会自立。l 有些人只要学会CSS的javascript基础知识并没有非常糟糕的英语(为了帮助金山词霸可以理解ExtJs的API任何)。你可以参考本教程的实践。《一》 从一切API开始 学ExtJs的朋友在初学ExtJs的时候认为ExtJs的非常easy效果非常好。几行代码就把效果搞定了。可是用得多了,抱怨就開始了:ExtJs的布局怎么这么麻烦...

Extjs4对Model定义相关的校验内容【图】

方法名称在添加上一个Message就可以设置错的内容了 config的内容如下config配置内容value,用户传递的值 来自为知笔记(Wiz)原文:http://www.cnblogs.com/babyhhcsy/p/7663e64b5df289d1a1f000abab9eb259.html

ExtJS 第一个程序【代码】【图】

本篇介绍如何创建一个ExtJS应用程序。并通过创建目录、导入文件、编写代码及分析代码等步骤来解释第一个ExtJS程序。目录1. 创建程序  1.1 创建目录建议  1.2 实际目录  1.3 index.html  1.4 运行图2. 代码分析  2.1 Ext.onReady()  2.2 Ext.create() 1. 创建程序1.1 创建目录建议根据官方建议,创建一个ExtJS应用程序的目录推荐如下:- appname| - app| - namespace| - Class1.js| - Class2.js| - ...| - extjs| - res...

Extjs中ajax请求当session失效时自动跳转【图】

当session失效时,我们可以通过filter来拦截并重定向到登陆页面,可是请求如果是ajax请求,页面并不会重定向,这是因为ajax返回的是数据,无法返回页面。ajax异步请求不同于其他请求,其在请求头里包含有X-Requested-With:XMLHttpRequest,看下面两张图的区别。我们可以在filter中通过它来判断一个请求是不是异步的,如果是,我们可以返回一个sessionstatus,在页面上通过判断sessionstatus的值来判断session是否失效。第一张是普通...

4、手把手教你Extjs5(四)主界面上加入顶部和底部区域【代码】

这一节为主界面加一个顶部区域和底部区域。一个管理系统的界面可以粗分为顶部标题部分、中间数据展示和处理的部分、底部备注和状态部分。在增加这二个区域之前,我们先在MainModel.js中加入一些数据。Ext.define(‘app.view.main.MainModel‘, {extend: ‘Ext.app.ViewModel‘,alias: ‘viewmodel.main‘,data: {name: ‘app‘,// 系统信息 system: {name: ‘工程项目合同及资金管理系统‘,version: ‘5.2014.06.60‘,iconU...

ExtJS ComboBox之 键入自动查询【代码】

Ext.create(‘Ext.form.Panel‘, { title: ‘菜单编辑‘, id:‘editMenuForm‘, bodyPadding: 5, // The form will submit an AJAX request to this URL when submitted url: ‘/SystemManage/SaveMenuForm‘, method: ‘POST‘, // Fields will be arranged vertically, stretched to full width layout: ‘anchor‘, defaults: { anchor: ‘100%‘ }, // The fields defaultType: ‘textfield‘, items: [{ name: ‘menuGuid‘, ...

项目开发中遇到的extjs常见问题【代码】

1事件触发机制2 3l 给某一个控件添加事件。4 5 obj.addEvents( {search : true });6 7l 给某一个事件添加处理函数8 9n 给一个对象或变量添加监听及对应得处理,可以在创建时,通过属性listener添加。10 11 n 或者通过 obj.on(‘event’,function(){})12 13 n 或者通过obj.addListener(“event”,function)14 15 16 17l 出发一个事件,params是要传给事件对应的处理函数的参数...

【extjs】 Extjs中的Ext.grid.Panel隐藏列会显示在表头中解决方法【代码】【图】

在Extjs中的GridPanel会有这样的情况,隐藏列会显示在menuDisabled中,但是这个一般没有什么用处,只是用于后台取值的作用,感兴趣的朋友可以了解下啊,希望本文对你有所帮助 在Extjs中的GridPanel会有这样的情况,隐藏列会显示在menuDisabled中 如下图:但是这个一般没有什么用处,只是用于后台取值的作用。so 加一个属性:hideable:false就可以搞定了。 { text: ‘用户ID‘, dataIndex: ‘uid‘,align: ‘center‘,hidden:true,...

extjs datafield 格式化

extjs DateField 的值用getValue()方法获取后是一大堆字符串,类似Tue Dec 07 2010 00:00:00 GMT 0800,这玩意存入数据库实在不好办。。。所以要把它格式化一下,方法很简单,用EXT的 Ext.util.Format.date()方法 示例: var gedt = Ext.util.Format.date(日期控件.getValue(), ‘Y-m-d‘); 出来的日期格式就是2010-10-10这样的 // date( String/Date value, [String format] ) : String Formats the passed date using the ...

跟我一起学extjs5(19--模块记录的拖放删除、拖放复制新增)【图】

跟我一起学extjs5(19--模块记录的拖放删除、拖放复制新增) 网页其中的拖放(drag-drop)是比較有趣的操作,extjs5中非常好的封装了拖放的动作,也有各种类来支持,可是要学好“拖放”这个东西真是非常难,特别是象我这样英语不好的人。看不太懂官网上的说明,做一个拖放的操作起码得几天的时间。 以下完毕拖放删除的功能。即,选中一条记录或多条记录。然后拖动到“删除”button上。最后松开鼠标进行记录删除的操作。操...

Extjs选中多行Grid提交【代码】【图】

要实现的效果如图:可以选择多行grid然后提交给后台1,Extjs中grid如何可以选择多行?定义一个grid,将色了Type设置为多选即可selType: ‘checkboxmodel‘, 2,controller层代码: 1 StdEvaluationToPaper:function(btn,event){2var grid=Ext.getCmp(‘StudentEvaluationGrid‘);3var form=Ext.getCmp(‘StudentEvaluationForm‘);4var records=grid.getSelectionModel().getSelection(); 5var title = form.getForm().getValues()...

ExtJs--01--引入ExtJs4.1.1

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><base href="<%=basePath%>"><title>ExtJs提示框学习</title><meta http-equiv="pragma" content="no-cache"><m...

Java Web项目(Extjs)报错二

1、Java Web项目(Extjs)报错二 具体报错如下:usage: java org.apache.catalina.startup.Catalina [ -config {pathname} ] [ -nonaming ] { -help | start | stop } 2014-3-26 22:46:18 org.apache.catalina.core.AprLifecycleListener init 信息: Loaded APR based Apache Tomcat Native library 1.1.27 using APR version 1.4.6. 2014-3-26 22:46:18 org.apache.catalina.core.AprLifecycleListener init 信息: APR capab...

Extjs初学者(一)【代码】【图】

Ext.form.field.Number针对数字约束的配置项 1<html> 2<head> 3<title>图书管理界面</title> 4<link rel="stylesheet" type="text/css" href="../ext-4.2.1/resources/css/ext-all.css"/> 5<script type="text/javascript" src="../ext-4.2.1/bootstrap.js"></script> 6 7<script> 8 Ext.onReady(function(){9 Ext.QuickTips.init(); 10var form =new Ext.form.FormPanel({ 11 title:‘示例‘, 1...

ExtJs + Struts2 + JSON【代码】

最近一直都在看EXTJS的东西,然后自己实践了下,界面倒是蛮漂亮的,但是一旦涉及到与服务器端进行数据互动麻烦就出来了,本来下了个例子确发现是 用DWR的,觉得我既然用了STRUTS2作为MVC的框架,我觉得这个框架还是很不错的,觉得还是把EXTJS整合到一起更好些,找了相关的资料,跟着 前辈做了下例子,发现完全不是那么回事,只好自己慢慢摸索,终于把数据交互的问题解决了,所以记录之以便查阅! 还是从底层开始说吧,拿最经...

[ExtJS5学习笔记]第三十四节 sencha extjs 5 grid表格之java后台导出excel【代码】【图】

继上次使用js前端导出excel之后,另一个主要大家比較关注的是后台实现导出excel,由于本人开发使用的java所以这里使用apache的开源项目poi进行后台excel的导出。本文文件夹本文文件夹poi项目下载及载入extjs前端导出设置extjs后台相应的解决方式创建excel工作簿创建一个excel页签生成excel样式并初始化产生表格标题行build headers构造数据行build rowspoi项目下载及载入POI项目是apache官网的一个开源项目,其主要目的是对microsof...

ExtJS4.2学习(19)在线编辑器Ext.form.HtmlEditor(转)【图】

鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-12-24/191.html--------------------------------------------------------------------------------------------不知道大家发觉这样的问题没,以前写Extjs3.X的时候,Eclipse在复制粘贴写代码的时候一点不卡,在4.2的时候,用eclipse写就会经常卡死的现象。下午研究了一下午,我可不想在写代码的时候一直被卡死,我就找到了新的IDE工具intellij idea (...

extjs PropertyGrid使用【代码】

var grid = new Ext.grid.PropertyGrid({title: ‘属性表格‘,autoHeight: true,width: 300,renderTo: Ext.getBody(),viewCondig: {forceFit: true},source: {‘名字‘: ‘不说‘,‘创建时间‘: new Date(),‘是否有效‘: false,‘版本‘: .01,‘描述‘: ‘没啥说的‘}}); 原文:http://www.cnblogs.com/yll-sww/p/4159844.html

bootstrap、jquery easyui、extjs界面比较

最近需要做一个界面,有下拉选择框、按钮、表格。之前用过jquery ui,样子还凑合,但是很大的一个问题是没有表格。于是我转向了bootstrap,这个最火最好的前端显示框架,发现它只是一个强调html5+css3的移动优先响应式设计的框框,很多东西都需要你自己订制。别说表格了,连下拉框都没有。不过好在它很火,于是有很多补充的项目。Flat UI不错,但用了一下报错,没时间研究源代码于是暂时放弃了。接着想起了以前很流行的easyui,登上...

Extjs中panel的 collapseMode 属性的应用,修改折叠箭头样式【图】

panel中属性collapseMode可以实现面板的折叠,不过属性自带的折叠箭头不太容易辨识,通过修改实现如下展现样式 具体代码实心如下:Ext.onReady(function(){ var mainPanel=Ext.create(‘Ext.panel.Panel‘,{ title:‘主信息‘, // collapsible:false, // layout:‘border‘, height:300, region:‘center‘ }); var linePanel=Ext.create(‘Ext.panel.Panel‘,{ title:‘明细信息‘, layout:‘fit‘, border :...

ExtJS浏览器对象模型BOM——命名空间和用户代理对象、Cookie【代码】

BOM(浏览器对象模型(BrowserObjectModel)),允许访问和操控浏览器窗口。研发者通过使用BOM,可移动窗口、更改状态栏文本、执行其它不与页面内容发生直接联系的操作。本文将从ExtJS中以下四类服务入手: 1,命名空间2,用户代理对象3,Cookie4,定时调用函数(将于下一博文详细陈述) 命名空间 ExtJS的命名空间是在window对象所提供的全局范围内建立相互独立的范围,概念上类似于Java的package。 Ext.namespace("com.baidu"); c...

【ExtJS】关于alias和xtype【代码】【图】

alias在api里的解释为:别名 类名称简短的别名列表。多数用于定义xtypes 1 Ext.define(‘MyApp.Panel‘, {2 extend: ‘Ext.panel.Panel‘,3 alias: ‘widget.mypanel‘,4 title: ‘MyPanel‘5});6 7 Ext.onReady(function(){8// 使用 Ext.create 9 Ext.create(‘widget.mypanel‘,{ 10 html: ‘Create Widget!‘, 11 width: 400, 12 height: 200, 13 broder: true, 14 ren...

[ExtJS5学习笔记]第二十七节 CMD打包错误 Error C2009: YUI Parse Error (identifier is a reserved word =&gt; debugger;)

本文地址:http://blog.csdn.net/sushengmiyan/article/details/41242993本文作者:sushengmiyan------------------------------------------------------------------------------------------------------------------------------------使用cmd打包ext的时候报了一个诡异的错误。细细找来,发现是代码书写导致。如今记录一下:错误具体信息:[ERR] C2009: YUI Parse Error (identifier is a reserved word =>debugger;) -- unkn...