`

extJs 常用语法1

 
阅读更多
  • 生成树,并进行过滤,并且最后去掉监听器
  • var ctree = initDeployRelationTree(treeLoader);
    
    var f = function(n) {
    console.log(n.text);
    if (n.hasChildNodes() == false) {
      if (n.getUI().checkbox != null) {
      n.getUI().show();
       filter(n);
       } else {
      n.getUI().hide();
      }
    } else {
    n.getUI().hide();
    
    }
    };
    
    ctree.on('expandnode', f);
    ctree.on('collapsenode', function() {
    ctree.removeListener('expandnode', f);
    });
    ctree.expandAll();
    
    
    

  • 拿到grid组件,取值
  • var rec = Ext.getCmp('roleCreateGridId');
    var personName = rec.get('personName');
    

  • combobox使用
  • 创建下拉列表
    
    Ext.define('State', {
    	extend : 'Ext.data.Model',
    	fields : [ {
    		type : 'string',
    		name : 'id'
    	}, {
    		type : 'string',
    		name : 'name'
    	} ]
    });
    
    // 图表下拉列表定义
    var chartStates = [{
    	"id" : "line",
    	"name" : "折线图"
    },              
    {
    	"id" : "column",
    	"name" : "柱状图"
    }, {
    	"id" : "pie",
    	"name" : "饼图"
    }];
    
    // 图表下拉列表公共store
    function initStore(state, data) {
    	var store = Ext.create('Ext.data.Store', {
    		autoDestroy : true,
    		model : state,
    		data : data
    	});
    	return store;
    }
    
    // 生成图表下拉列表
    function initChartComboBox() {
    	var store = initStore('State', chartStates);
    	var simpleCombo = Ext.create('Ext.form.field.ComboBox', {
    		id : 'chartComboBoxId',
    		fieldLabel : '图表类型',
    		displayField : 'name',
    		valueField : 'id',
    		width : 120,
    		labelWidth : 60,
    		store : store,
    		queryMode : 'local',
    		typeAhead : true,
    		columnWidth : .33,
    		
    	});
    	return simpleCombo;
    }
    
    
    
    

    控制combobox
    var yBox = Ext.getCmp('displayYBoxId');
    var yvalues = [];
    yBox.setValue(yvalues);  //更换类型后,清空下拉列表
    

    select监听事件
    listeners : {
    			'select' : function(combo, records, eOpts) {
    				var yBox = Ext.getCmp('displayYBoxId');
    				 var record = records[0];
    				 chartType = record.get('id');
    				 var yvalues = [];
    				 yBox.setValue(yvalues);  //更换类型后,清空纵轴
    				if(record.get('id')=='pie'){
    				     yBox.multiSelect=false;
    				     yBox.setFieldLabel("展示字段");
    				}else{
    					 yBox.multiSelect=true;
    					 yBox.setFieldLabel("纵轴字段");
    				}
    			}
    		}
    


    分享到:
    评论

    相关推荐

      extjs常用增删改查操作

      1. **ExtJS 环境搭建**:确保已安装 ExtJS,并正确引入所需的库文件。 2. **JavaScript 和 HTML 基础**:熟悉 JavaScript 的语法和 HTML 结构。 3. **数据模型理解**:了解如何定义和使用数据模型,这对于 CRUD 操作...

      Extjs3.0 常用组件介绍及怎么安装开发利器Spket

      6. **开始开发**: 现在你可以开始使用Spket的强大功能,如代码提示、自动完成、语法检查和调试,来提高你的ExtJS开发效率。 通过以上步骤,你可以充分利用Spket的特性,高效地进行ExtJS 3.0的开发工作。Spket的强大...

      VS Code 搭配 Sencha Plugin 插件简直不要太好用.用于开发 ExtJS/ExtAngular

      3. **语法高亮和格式化**:该插件支持ExtJS和ExtAngular的语法高亮,使得代码更加易读。同时,它还提供代码格式化功能,确保你的代码风格统一,符合编码规范。 4. **错误检查和调试**:Sencha Plugin能实时检测代码...

      ExtJS中文手册.pdf

      #### 1. EXT简介 - **背景介绍**:ExtJS是一款基于JavaScript的开源框架,用于构建现代化的Web应用程序。它提供了丰富的UI组件和工具,使得开发者能够轻松地创建高性能的用户界面。无论你是新手还是有一定经验的...

      轻松搞定Extjs

      - **Ext.apply()和Ext.applyIf()**: 这两个方法用于合并对象属性,是Extjs中常用的设计模式之一。 #### 消息框 消息框是与用户交互的重要手段之一。本章详细介绍了Extjs提供的多种消息框类型及其使用方法。 - **...

      extJs2.0+spket-1.6.11.zip

      ExtJS 2.0 和 Spket 1.6.11 是两个在Web开发领域中常用的工具,尤其在创建富互联网应用程序(Rich Internet Applications,RIAs)时。这两个工具的结合使用可以极大地提升开发效率和代码质量。 **ExtJS 2.0** ExtJS...

      ExtJs自定义消息框

      本文将详细介绍ExtJs中三种常用的消息框——提示框(Alert)、输入框(Prompt)和确认框(Confirm)的使用方法,并通过实例演示如何在实际项目中运用这些功能。 #### 二、提示框(Alert) 提示框主要用于向用户...

      Eclipse-ExtJS本地更新插件

      对于ExtJS插件,这些类可能包含了与Ext JS语法解析、代码高亮、自动完成等相关的核心逻辑。 在使用Eclipse-ExtJS本地更新插件时,开发者可以享受到以下几点主要优势: 1. **代码补全**:在编写Ext JS代码时,插件...

      基于EXTJS框架的工作流设计器

      1. 用户通过EXTJS界面选择或创建新的工作流。 2. VML+JS负责将工作流的图形元素渲染在前端页面上,允许用户拖拽、编辑节点和连接线。 3. 当用户对工作流进行操作时,EXTJS会通过Ajax通信与后台交互,传递修改的数据...

      HTML、JS、ExtJS、jQuery智能提示Eclipse插件

      HTML、JavaScript、ExtJS和jQuery是Web开发中常用的四种技术,它们在构建动态、交互式的网页应用中扮演着重要角色。Eclipse作为一个强大的集成开发环境(IDE),为开发者提供了丰富的插件支持,以提高开发效率。针对...

      ExtJS6学习资料

      - **推荐工具**:如 Visual Studio Code、WebStorm 等,这些 IDE 支持 ExtJS 的语法高亮、代码提示等功能,极大提升了开发效率。 - **插件支持**:许多 IDE 提供了针对 ExtJS 的扩展插件,可以进一步增强开发体验。 ...

      ExtJS 3.2的中文参考手册

      - **表格 (Grid)**: 是ExtJS中最常用的数据展示组件之一,可以轻松地实现数据的分页、排序等功能。创建表格的基本步骤包括定义数据模型、列模型等,例如:`var store = new Ext.data.JsonStore({ url: 'data.json', ...

      extjs4.0.2a+spket1.6.18

      2. **语法高亮**:支持JavaScript和ExtJS的语法高亮,使得代码更易读。 3. **模板和片段**:预设了许多常用的代码模板和片段,便于快速生成常见的代码结构。 4. **调试工具**:集成JavaScript调试器,能设置断点、...

      精通JS脚本之ExtJS框架.part2.rar

      第1章 JavaScript入门必备 1.1 JavaScript语言概述 1.1.1 JavaScript简介 1.1.2 JavaScript特点 1.1.3 JavaScript与Java 1.2 第一个JavaScript程序 1.2.1 嵌入JavaScript 1.2.2 链接外部JavaScript文件 ...

      extjs基础入门

      非常适合extjs初学者,包括一些基本结构,语法和常用语法

      ExtJs入门之简单案例

      对于初学者而言,掌握ExtJs的基本语法和常用组件是进入这一领域的关键。本文将聚焦于ExtJs中的`Ext.MessageBox`组件,详细介绍其主要方法与应用,帮助读者快速入门并提升实践能力。 ### Ext.MessageBox 组件详解 #...

      ExtJS 中文手册

      #### 1. EXT简介 - **适用人群**: 无论是初学者还是希望深入了解Ext的开发者,本文档都适合阅读。 - **前提条件**: 需要具备一定的JavaScript基础以及对HTML DOM的基本理解。 #### 2. 目录结构与内容组织 - **下载...

      精通JS脚本之ExtJS框架.part1.rar

      第1章 JavaScript入门必备 1.1 JavaScript语言概述 1.1.1 JavaScript简介 1.1.2 JavaScript特点 1.1.3 JavaScript与Java 1.2 第一个JavaScript程序 1.2.1 嵌入JavaScript 1.2.2 链接外部JavaScript文件 ...

      ExtJS与.NET结合开发实例

      C#是.NET中最常用的语言,语法简洁,面向对象,适合快速开发。ASP.NET是.NET框架下的Web开发部分,提供了诸如ASP.NET MVC和ASP.NET Web Forms等多种开发模型。 将ExtJS与.NET结合,开发者可以在前端利用ExtJS创建...

      ExtJS Web应用程序开发指南

      1. **XTemplate**:这是ExtJS中最常用的模板类,它允许用JavaScript语法混合HTML,可以动态渲染数据到DOM。 2. **模板语法**:使用`{}`包围变量名,例如`<span>{name}</span>`,模板会将数据对象的`name`属性值插入...

    Global site tag (gtag.js) - Google Analytics