在项目实践的过程中,遇到需要将grid中数据根据某一字段分组的要求,当然,这个功能在api中有,在此列出来以供大家查找: 两点需要注意的地方: 1、在创建store时,需要设置groupField属性的值,即为需要分组的值 for example: JavaScript代码Ext.define('Person', { extend: 'Ext.data.Model', fields: ['name', 'sex'] }); 在这个数据模型中,我们需要以性别(sex)分组,那么请看下面的store JavaScript代码var PersonStore = ...
EXT的全部js是比较大的,一个ext-all-debug.js就达2m多,它的压缩版(去掉js中的换行及空格),也达600多k,这对于在网速不太快的时,下载js就得漫长的等待。其中日历任务控件,js多达四五个,每个js大小都达70多k,尽管我们采用了后加载的方式,则当用户点击我的任务功能时,才下载该js,但这样仍然很慢,因为下载的js很慢 ,鉴于此,在互联网上使用类似Joffice类似的程序,速度会使很多开发商不敢选用ext作为开发技术。 我们可以从...
EXTJS GRID 中 单击行和单元格获得行或者单元格的内容(数据) Js代码 代码如下: grid.addListener(cellclick,cellclick); function cellclick(grid, rowIndex, columnIndex, e) { var record = grid.getStore().getAt(rowIndex); //Get the Record var fieldName = grid.getColumnModel().getDataIndex(columnIndex); //Get field name var data = record.get(fieldName); Ext.MessageBox.alert(show,当前选中的数据是+data); } gr...
后台从数据库取出时间,JSON格式化后再传到gridpanel,这时时间变成了:/Date(32331121223)/这样的格式,那么这时需要以下处理才可以正常显示: 在 代码如下: var record = Ext.data.Record.create([ { name: PublicDate, mapping: PublicDate, dateFormat: Y-m-d, convert: function (v) { if (v == null) { return null; } var d = new Date(); var str = v.toString(); var str1 = str.replace("/Date(", ""); var str2 = str1...
问题一个页面有两个面板,都有一个【添加(F2)】按钮,如何做快捷键支持?图片示意 第一次实现感觉应该很简单,ExtJs提供了“Ext.util.KeyMap”,很容易做快捷键支持。代码示例 代码如下:/// Ext.onReady(function () { var viewport = Ext.create(Ext.container.Viewport, { layout: { type: vbox, align: stretch }, padding: 10, items: [{ xtype: pa...
在设计ExtJS应用程序时最常做的事情就是注册事件处理程序,因为在ExtJS的世界里,几乎完全由时间组成。因此,ExtJS的设计者使注册事件变得非常容易(同时还提供了非常不容易的方式任你选择)——on/un,也就是上与下两种方式,或是addListener与removeListener,Element的所有子类都可以使用。例如有一个希望在用户按下时能够给予简单的反馈: 如何替这个注册鼠标单击事件呢?首先必须取得这个div的Element实例: varhappyDiv=Ext.g...
首先在grid的tbar中定义编辑按钮:Js代码 代码如下:id:editDataButton, text:编辑, tooltip:编辑, iconCls:edit, handler: function(){ showeditPanel();} 再定义form: Js代码 代码如下:var xjjlEditForm = new Ext.FormPanel({.......省略form中的定义内容........});然后定义编辑按钮要调用的函数showeditPanel(同时定义一个加载form的window): Js代码代码如下://--编辑按钮调用的函数(弹出编辑窗体) function showeditPane...
前台代码: 代码如下:Ext.get(outputuser).on(click, function(e){ Ext.MessageBox.confirm(提示,确定要导出用户吗?,function(btn){ if(btn=="yes"){ Ext.Ajax.request({ url:"可以获得要下载文件的url", success:function(res){ var obj =Ext.decode(res.responseText); //alert(res.responseText); window.location.href =obj.path; } }); } })});后台: 代码如下:$json = ...
1。formpanel数据源和grid相同,使用 Form.getForm().loadRecord(row);则数据便可自动加载在formpanel中对应的控件。2。formpanel数据源是单独的,则store传入到formpanel页面后,还需要手动将formpanel中的每个控件用value赋值,形如: 代码如下:{ xtype: "textarea", fieldLabel: "备注说明", value: row.Note, id: Note,...
1、之前在winForm上有看过在选择数据时会将一些数据放在待选框中,而用户可以将想要选择的数据放到备选框中,那么如何用Extjs实现类似功能,我们选择用两个gridPanel来模拟其中的备选框和待选框。如下图所示: 定义代码如下: 代码如下: { xtype:gridpanel, multiSelect: true, id:staff, x: 5, y: 0, height: 205, wid...
代码如下:/** * 定义降序的groupingStore */var DescGroupingStore = Ext.extend(Ext.data.GroupingStore, { groupDir : ASC, groupBy : function(field, forceRegroup, direction) { direction = direction ? (String(direction) .toUpperCase() == DESC ? DESC : ASC) : this.groupDir; if (this.groupField == field this.groupDir == direction && !forceRegroup) { ...
代码如下://只要要在treepanel中配置一下viewConfig即可,如果是两棵树之间,两棵树都要配置 viewConfig:{ plugins :{ ptype:treeviewdragdrop, appendOnly:true //只能拖着带非叶节点上 }, listeners:{//监听器 drop:function(node,data,overModel,dropPosition,options){ //ajax的操作把数据同步到后台数据库 alert("把:"+data.records[0].get(text)+" 移动到:"+overModel.get("text")); },...
ExtJS中表格的特性简介 表格由类Ext.grid.GridPanel定义,继承自Ext.Panel,xtype为grid 表格的列信息由Ext.grid.ColumnModel定义 表格的数据存储器由Ext.data.Store定义,根据解析数据的不同,数据存储器可具体分为如下几种: JsonStore,SimpleStore,GroupingStore… 一个表格的基本编写过程: 1、创建表格列模型 var cm = new Ext.grid.ColumnModel({{header: 角色, dataIndex: role},{header: 等级, dataIndex: grade},{heade...
在ExtJS中,不管是叶子节点还是非叶子节点,都统一用TreeNode表示树的节点。在ExtJS中,有两种类型的树节点。一种节点是普通的简单树 节点,由Ext.tree.TreeNode定义,另外一种是需要异步加载子节点信息的树节点,该类由Ext.tree.AsyncTreeNode定 义。 在数据中, text 显示文字, leaf 节点 , children 子节点,expanded 展开var store = Ext.create(‘Ext.data.TreeStore, { root: { expanded: true, children: [ { text: “留学...
EXT的全部js是比较大的,一个ext-all-debug.js就达2m多,它的压缩版(去掉js中的换行及空格),也达600多k,这对于在网速不太快的时,下载js就得漫长的等待。其中日历任务控件,js多达四五个,每个js大小都达70多k,尽管我们采用了后加载的方式,则当用户点击我的任务功能时,才下载该js,但这样仍然很慢,因为下载的js很慢 ,鉴于此,在互联网上使用类似Joffice类似的程序,速度会使很多开发商不敢选用ext作为开发技术。 我们可以从...