EXTJS - 技术教程文章
javascript – 如何将图像居中在ExtJS GridPanel的列中？
我想在“数据”列中水平居中图标： 我有textAlign：在我的专栏中心： 在图标渲染器功能中,我使用CSS水平居中： 但它仍然是左对齐的. 我还需要做什么才能使列中的图标水平居中？解决方法:这有点猜测,因为我没有任何东西需要测试. 我注意到margin：0 auto无法使图像居中. 这导致我认为你需要显示：阻止图像 – 这应该让你的保证金规则做你期望的.
javascript – 使ExtJS边框布局的中心项水平滚动【代码】
我有一个带有边框布局的容器的ExtJS视口,我想让中心区域的容器支持水平滚动.这就是代码现在的样子(这是Rails应用程序的一部分,所以请原谅提供一些内容的ERB代码)：var viewport = Ext.create('Ext.container.Viewport', {defaultType: 'container',layout: 'border',items: [{defaultType: 'container',minWidth: 800,region: 'north',items: [<%= render "shared/header" %>,<%= render "shared/title_bar" %>]},{defaultType: 'c...
javascript – 在网格列中添加按钮. ExtJS的【代码】
我想在网格中的一列中添加按钮.我试试这段代码listeners: { render: {fn: function(kad_tab){var view = kad_tab.getView();for (var i = 0; i < store.getCount(); i++) {var cell = Ext.fly(view.getCell(i, 2));new Ext.Button({handler: function(){alert('Suppression')},renderTo: cell.child(".btn"),text: 'Supprimer'});}},// delay: 200 }}{header: "", width: 70, dataIndex: '', renderer: function(){ return '<div c...
javascript – 在ExtJs中,如何在TextArea中的插入位置插入固定字符串？【代码】
这个问题可能在其他框架中被问到,不确定ExtJ上是否有一个,我是新手.我想知道是否有一个TextArea和一个按钮的简单示例.按下按钮时,固定字符串“???”插入TextArea中的光标处. 提前致谢.解决方法:您实际上可以直接从DOM执行此操作,使用textareas selectionStart属性来查找插入位置. 所以你可以做一些事情textArea.value = textArea.value.substring(0, selectionStart)+'???'+textArea.value.substring(selectionStart);这是一个jsfi...
javascript – 如何从JSONStore w / ISO 8601格式保存记录时让ExtJS包含时区？【代码】
在下面的代码片段中,我创建了一个JsonStore(其记录类型是单个日期字段),向其添加新记录,然后保存它.保存时,时区不包含在序列化日期值中,即使它包含在实际记录对象中(如Firebug所示). Ext似乎将日期转换为浏览器的时区,但在将请求发送到服务器时删除时区.我正在使用ISO 8601日期时间格式(‘c’),如果我正确阅读Ext文档,则应包含时区. 即使它正在转换到浏览器的时区,只要它在保存记录时包含该时区,这对我来说也不会有问题.现在看来,必...
javascript – EXTJS选项卡面板使标签拉伸以填充面板【代码】
我遇到的问题是我无法在extjs选项卡面板上标记以填充面板的整个宽度.我曾尝试过调用resizeTabs,但事先没有找到这个探测器的答案.解决方法:在tabpanel配置中,添加以下tabBar配置：tabBar: {defaults: {flex: 1},dock: 'top',layout: {pack: 'center'}}
javascript – IE9权限在写入窗口时被拒绝 – ExtJS 4 App【代码】
var display_setting = "toolbar=yes, location=no, directories=yes, menubar=yes,";display_setting += "scrollbars=yes, width=750, height=600, left=100, top=25";var printwin = window.open('', 'printwin', display_setting )printwin.document.open()printwin.document.write("Testing")printwin.document.close()为什么上面的代码在IE9中生成“Permission Denied”错误,但在Firefox或Chrome上运行得很好？有工作吗？它是...
javascript – ExtJS – 区分MultiSelect中的项目【代码】
我在ItemSelector中有2个MultiSelects,它本身在FormPanel中.每个MultiSelect由2个商店组成：左侧和右侧(带箭头以在2之间移动项目). 当我加载面板时,我提供一个参考,以突出显示从一侧移动到另一侧的项目(例如,将设置的样式设置为红色以移动项目),因为今天无法区分它们. 我设法在商店后添加事件并通过DOM访问应用我的风格.这在跟踪期间有效,但稍后会执行剩余的ExtJS标准调用,覆盖我刚刚应用的样式… 我觉得我所做的并不是好方法,但我...
javascript – extjs存储代理不调用xtype【代码】
我有一个弹出窗口,有一些xtypes,一个xtype是一个网格,有一个商店,但我没有看到它调用任何ajax调用.有人能告诉我我错过了什么吗？Ext.define('myApp.view.myPopup' {... .... {xtype: 'grid',store: 'MyStore',iconCls: 'x-fa fa-users',height : 450,columns: [{header......}商店Ext.define('myApp.store.MyStore', {extend: 'Ext.data.Store', model: 'myApp.model.modelA',pageSize: 100,remoteSort: true,autoload : true,prox...
javascript – 从json store extjs获取记录【代码】
我有一个json存储加载,我需要从中获取一条记录.我用过：getAt(index),find(),getById(),但没有结果.这是我的代码：var appSettingReader = new Ext.data.JsonReader({ root: 'results',},[{name: 'id', type: 'int', mapping: 'id'},{name: 'projetId', type: 'int', mapping: 'projetId'},{name: 'resLevels', type: 'int', mapping: 'resLevels'},{name: 'maxResToLock', type: 'int', mapping: 'maxResToLock'},{name: 'ma...
javascript – 如何在ExtJs 4或3中编写自定义布局【代码】
我想写自己的布局..(比如vbox,border等等)…我想要做的是创建布局,将其内容放在中间(verticall – middle,horisontal – middle).. 有没有人可以告诉我这个控件在extJs中会是什么样子,或者可以提供一些可能有用的链接？ 我有这个例子 http://dev.sencha.com/deploy/dev/examples/layout-browser/layout-browser.htmlExt.ux.layout.CenterLayout = Ext.extend(Ext.layout.FitLayout, { // private setItemSize : function(item,...
javascript – 在ExtJS 4 Grid中设置单元ID【代码】
我正在将相当大量的旧HTML代码移植到ExtJS 4网格中,并且偶然发现了以下挑战：我希望能够为网格中的TD元素设置自定义ID.据我了解,我需要覆盖用于创建单元格的默认模板.我当前的模板如下所示：Ext.view.TableChunker.metaRowTpl = ['<tr class="' + Ext.baseCSSPrefix + 'grid-row {addlSelector} {[this.embedRowCls()]}" {[this.embedRowAttr()]}>','<tpl for="columns">','<td class="{cls} ' + Ext.baseCSSPrefix + 'grid-cell '...
javascript – 在ExtJS中拖动时删除反馈图标【代码】
我创建了一个DataView,其中的项目可以在内部拖动以重新排列,但问题是,虽然我可以轻松地拖动和重新排列数据视图中的项目,但在拖动时,创建项目的叠加显示“红色”反馈图标(这表明该项目不能放在这里),虽然我不希望显示任何反馈图标(绿色或红色),只是项目的叠加就足够了. 如何摆脱反馈图标？解决方法:简短的回答,你可以添加这两个CSS规则：.x-dd-drag-ghost {padding-left: 5px; } .x-dd-drop-icon {display: none; }如果您不想隐藏整...
php – 在ExtJS网格中将NULL值显示为空字符串而不是“null”字符串的最简单方法是什么？【代码】
我有一个服务器端脚本(PHP)返回JSON数据来填充ExtJS网格. 此数据来自MySQL查询,包含一些NULL值. 当PHP将其编码为JSON表示法时,它保持NULL完整：{"id":"33","name":"Test1","url":null,"cls":"x-tree-noicon","expanded":true}但是……当这些数据显示在ExtJS网格中时,它会在NULL值的位置显示一个“null”字符串. 我不希望它显示“null”.我只想要它空(一个空字符串). 实现这一目标的最简单方法是什么？ 谢谢.解决方法:我不确定是否最...
javascript – ExtJs 4上的TreeNode点击事件【代码】
我正在使用ExtJS 4(beta 3),我有一个TreePanel,这是我的导航菜单.它是这样的： >乔布斯 >添加工作>列出所有工作 > …… > ……> …… (这将在许可系统基础上进行,但这是另一个故事) 在ExtJS 3上,当我点击“添加工作”时,做一些事情就像添加一样简单... leaf:true, listeners:{ click:function(n){//my code...} } ...到root子元素. 现在不是那么简单.我越接近(在树梢上)listeners:{click : {element : 'el',fn : function(eve, ele...
javascript – 我将如何从json文件创建模型？ (ExtJS的)【代码】
这是我想用json文件创建的模型Ext.define('Users', {extend: 'Ext.data.Model',fields: [{name: 'user_id', type: 'int'},{name: 'user_name', type: 'string'}] });基于来自服务器的json响应的内容,我需要做什么才能自动创建此模型？解决方法:为了自动创建模型,您需要将metaData字段包含在Json数据中. metaData可用于描述模型的所有字段. 在ExtJS 4.1文档中 – Ext.data.reader.Json有一个名为Response MetaData的部分,它描述了...
javascript – ExtJs,保持图像不会在Ext.Img中拉伸【代码】
我不确定是否可以这样做,但ExtJS中是否可以在Ext.Img组件中保持图像不会拉伸到组件的大小而是保持其比例？为了防止它看起来拉长？ 让我试着通过研究这一点来澄清这一点,如果在HTML中我会做这样的事情<img src=# />图像没有改变,只是我需要它的大小,如果在ExtJs中我做了这样的事情xtype:'image',id: 'south_image',src: '#',region: 'south',width: 700,height: 200然后图像被拉伸,有没有办法,假设Ext.Img比图像大,我如何让图像保持...
javascript – 如何过滤ExtJs GridPanel / ExtJs商店？【代码】
我是ExtJs的新手.我有一个与数据存储绑定的GridPanel.我有一个checkboxgroup,它包含GridPanel行的可能值.我想用checkboxgroup值过滤GridPanel. 这是代码 – Store1 = new Ext.data.JsonStore({ url: 'CustomerProfiles/GetDetails', root: 'rows', fields:['Name','Id'] });DetailedResults ={xtype: 'grid',autoHeight: true,autoWidth: true,autoScroll: true,border: false,trackMouseOver: false,frame: true,store: Store1,co...
javascript – 如何在extjs中单击按钮后打开窗口【代码】
我正在使用extjs设计师2.它工作正常,我设计了一个视口.它会创建一些视图文件.第一个是myviewport.js：Ext.define('MyApp.view.MyViewport', {extend: 'Ext.container.Viewport',layout: {type: 'border'},initComponent: function () {var me = this;Ext.applyIf(me, {items: [{xtype: 'tabpanel',activeTab: 1,region: 'center',items: [{xtype: 'panel',title: 'SIM usage'}, {xtype: 'gridpanel',title: 'Reports',forceFit: tr...
javascript – Extjs：定期执行一个函数【代码】
如何使用ExtJS定期启动函数.我尝试了示例代码from the docs,但是我收到了一个错误.var runner = Ext.util.TaskRunner(), task = runner.start({run: function(){ ... },interval: 1000 });task = runner.start(…)出错Uncaught TypeError: Object #<Object> has no method 'start'我也发现这段代码很长.在ExtJS中启动常规任务是否有更短的版本？解决方法:更短的版本是Ext.TaskManager.start({run: function() { ... },interval: 10...
javascript – 树的ExtJS数据存储
我有一个基本的ExtJS问题,基于阅读文档和搜索,我似乎无法解决这个问题.目前我有一个TreePanel直接从URL加载JSON.我正在尝试将数据与视图分开,这样我也可以使用该数据输入OpenLayers地图(使用GeoExt).如何将TreePanel指向Ext.data.Store而不是URL？解决方法:TreePanel使用TreeLoaders而不是Stores来加载数据.原因是树需要分层数据,而存储是平面表结构,不支持层次结构.基本数据对象也不同(Record vs. Node).当然,您可以使用父/子键将...
javascript – 使用phantomjs在本地文件上使用extjs代理进行ajax调用【代码】
我有一个基本的EXT JS商店,它使用代理来访问本地json文件. 例如... proxy: {type: 'ajax',api: {read: 'data/mydata.json'},reader: {type: 'json',root: 'datas',successProperty: 'success'} } ...我想用Maven,Jasmine和PhantomJS用Atlassian Bamboo(我的CI服务器)构建和测试我的项目. 当我在本地执行PhantomJS时,如下所示：$phantomjs "c:\phantomjs-1.6.1\examples\run-jasmine.js" run-tests.html我得到以下输出：'waitFor()...
javascript – jQuery,Prototype,Extjs,mootools,Scriptaculous,Spry,YUI,DOJO框架有什么区别？
我一直听说很多JavaScript框架,即 jQueryYUIDOJOExtJsPrototypeMootoolsScriptaculousSpry 还有一些. 有谁能告诉我具体的目的,这些框架服务吗？ 我只是jQuery的用户.解决方法:这是一个基于我的经验和知识(和IMO)的简短描述： jQuery – >是最流行的javascript库(网上有很好的支持和很多为它编写的插件),它对所有人来说都很简单(包括设计师).它是dom操作和快速编写代码的最佳选择(非常适合前端) DOJO – >高级js库,提供根据需要加...
javascript – Extjs 4.0.2a打破网格列隐藏？【代码】
我刚刚更新了我的程序,使用了之前的4.0.0中的Ext JS 4.0.2a.我的程序的某些部分在升级后中断,其中之一是网格的显示/隐藏列选项无法正确显示.下面的截图是我的机器上的渲染方式; 请注意,列列表在页面顶部呈现,列表本身为空. 我不确定这是否是特定于平台/浏览器的,但我使用的是Ubuntu Linux,在Firefox和Chromium中运行我的程序时出现了这样的错误. 以下是我的网格列的声明方式：{xtype: 'gridcolumn',header: 'windspeed_max',sortab...
javascript – ExtJS DateField混淆格式【代码】
我使用指定格式的Ext.form.DateField是’d-m-Y’,如下所示：var sellingDate = new Ext.form.DateField({fieldLabel : "Selling date",width : 180,name: 'sellingDate',format: 'd-m-Y',allowBlank : false });我希望此组件在失去焦点后以给定格式自动完成输入值.我的意思是如果我输入文本’040212′(2012年2月4日,在我的国家,我们使用’dd-mm-YYYY’作为标准日期格式),它必须将该文本显示为’04 -02-2012′.但是当调试DateField的...
javascript – ExtJS 4.1.x – 里面有一个Combobox的Picker【代码】
我有一个自定义选取器类,里面有一些文本字段和一个组合框.应用程序中的网格使用此选择器作为列的编辑器,但问题是,无论何时单击组合框,选择器都会丢失它的焦点并关闭.有没有办法修改选择器以使用组合框来选择数据？解决方法:我通过使用collapseIf函数找到了解决此问题的方法. 此代码检查事件目标是否为BoundList(内部使用的DataView for ComboBox)和部分选择器组件：collapseIf: Ext.Function.createInterceptor(Ext.form.field.Pic...
php – 使用extjs 3在网格列数据中滚动条【代码】
我正在使用extjs3和PHP来开发应用程序,它是一个自定义框架.我有网格列出来自任何特定表的记录.但是如果网格中的任何列/字段都有相当大的文本ex：“notes”字段,文本如“我的名字是xyz而我来自abc.我的DOB是bla bla bla”,那么在这种情况下它会出现因为“我的名字是……”并且看到文本的其余部分,我必须伸展那个专栏,这非常令人恼火.这就是我想在网格中向该字段添加一些滚动条的原因.如果您对此案例有任何替代解决方案或如何使用滚动...
javascript – 网格面板的ExtJS Ajax问题【代码】
我的代码中有一个网格面板：Ext.create('Ext.grid.Panel', {id : 'frPanel-' + interfaceId,store : frStore,columns : [{text : 'Sequence',dataIndex : 'ruleId',menuDisabled : true},{text : 'Source',dataIndex : 'source',renderer : function(value, metaData) {var newValue = convertObjValue(value);if (newValue.match(/[-]+/i)) {metaData.tdAttr = 'data-qtip="'+ networkStore(value) + '"';}return newValue;}}, //...
javascript – 如何在ExtJS商店代理中更改extraParams的分隔符？【代码】
我遇到了与ExtJS商店的extraParams相关的问题.我需要更改默认的params分隔符&定制的;因为我正在访问的网络服务没有响应& ;. 有没有办法改变分隔符？ Bests,Andreas解决方法:ExtJS没有任何内置功能可以自定义参数分隔符 – 使用’&’毕竟,这是一个事实上的标准. 但是,如果需要,可以通过重写Ext.Object.toQueryString来更改默认行为Ext.define('Ext.override.CustomQueryString', {override: 'Ext.Object',toQueryString: functio...
javascript – 在范围CSS模式下设置ExtJS 4.2的正确方法是什么？【代码】
似乎ExtJS 4.2不包括作用域CSS.因此,当我应用ExtJS渲染网格时,我的页面外观会被破坏.我查看了这个链接：How to scope the reset CSS so that is applied to Ext components using scopeResetCSS property? 我想知道是否有一种方法可以使作用域重置CSS或任何方法在ExtJS 4.2中执行我想要的操作.解决方法:@Sencha解释了this链接中的修复.ExtJs v4.1.1 or v4.2.1Ext = {buildSettings:{baseCSSPrefix: 'x-',scopeResetCSS: true ...