Ext4.0 经常使用代码整理(一)
代码 整理 经常 使用
2023-09-11 14:20:43 时间
一:经常使用工具条上的定义
// 工具条 var toolbar = Ext.create("Ext.Toolbar", { items : [ yearCbo,zoneCbo,indexCbo,srchBtn] }); // 年度 var yearCbo = { xtype : 'numberfield', id : 'toolbar_year', name : 'year', fieldLabel : '年度', labelWidth : 40, allowBlank : false, blankText : '请选择年度', width : 100, value : new Date().getFullYear()-1, maxValue : new Date().getFullYear(), minValue : 2013 }; // 月份 var monthCbo ={ xtype : 'numberfield', id : "mounth", fieldLabel : '月份', labelWidth : 40, editable :false, allowbBlank : true, width : 100, maxValue : 12, minValue : 1, value : new Date().getMonth()+1 } // 查询按钮 var srchBtn = { xtype : 'button', id : 'srchBtn', text : '查询', iconCls : 'searchicon', listeners:{ click:function(){ alert(123456) ; } } };
二:combox的定义使用
// store定义 var indexStore = new Ext.data.Store({ fields:["value","name"], proxy: { type: 'ajax', url: 'Summary_getEnmuList?ENMU_CODE=24' }, autoLoad: false, remoteSort:true, reader:{ type:'json' } }); // 改变store的值(这里添加一项) indexStore.load({ callback: function(records, operation, success) { // do something after the load finishes var allIndexRecord = {name:"測试首项", value: -99 }; indexStore.insert(0,allIndexRecord); }, scope: this }); // 定义combox var indexCbo = { xtype : 'combobox', id : 'toolbar_indexCbo', name : 'indexCbo', fieldLabel : '11 项指标', labelWidth : 70, width : 220, value : '01', queryMode : 'local',// [local|remote] store : indexStore, editable : false, emptyText : '---请选择---', allowBlank : false, blankText : '请选择指标', displayField : 'name', valueField : 'value' };
三:定义控件的值获取
Ext.getCmp('cbo').getValue()。 Ext.getCmp('cbo').getRawValue()。
四:Ext.form.Panel
var form=Ext.create('Ext.form.Panel',{ items:[toolbar] }); var myform = form.getForm(); if(myform.isValid()){ myform.submit({ url : 'test.action', method : 'POST', type : 'ajax', waitTitle : "提示",// 等待的标题 waitMsg : '正在提交数据...',// 等待的信息 success : function(fp, o) { if (o.result.success == 'true') { myGrid.store.loadPage(1); } Ext.Msg.alert('提示',o.result.message); }, // 404或者500错误就会运行 failure : function(fp, o) { Ext.Msg.alert('提示','出现异常'); } }); }
五:高速创建简单mvc
AM.view.TestList
Ext.define('AM.view.TestList', { extend : 'Ext.form.Panel', alias : 'widget.testList', frame : true,// 面板渲染 columnLines : true, // 行线 multiSelect : true,// 执行多选 forceFit : true,// 自己主动填充panel空白处 autoScroll: true, initComponent : function() { this.id = 'testList'; var myPanle = new Ext.Panel({ bodyStyle:'background-color:#FFFFFF', html:'測试页面', height:'100%' }) ; this.items = [ myPanle]; this.callParent(arguments); } });
AM.controller.TestController
Ext.define('AM.controller.TestController', {
extend : 'Ext.app.Controller',
views : ['testList'],
init : function() {
this.control({
});
}
});
相关文章
- 【优雅代码】深入浅出 妙用Javascript中apply、call、bind
- RestKit:iOS开发必备,告别众多无聊代码
- 老友记:垃圾代码长成什么样子?
- 百度攻城狮训练营2021-工程能力study2 -- 2.4 代码检查规则:Python 语言案例详解 脑图整理
- 百度攻城狮训练营2021-工程能力study2 -- 2.3 代码检查规则背景及总体介绍 脑图整理
- C#,实用代码,整理视频文件必备函数,提取avi,mpeg,mp4,rmvb,mkv,flv等等视频文件摘要信息的方法及其源程序
- 如何用Python画各种著名数学图案 | 附图+代码
- 《C和C++代码精粹》——2.11 更高深的内容
- github不再通过验证密码方式push代码
- 生成素数的matlab代码
- 「c++小学期」实验题目及代码
- (JAVA):四种内部类的细节理解,文字+代码会更好理解----第三部分重点
- 面试突击(六)——JVM如何实现JAVA代码一次编写到处运行的?
- ST7789-TFT屏幕驱动(整理有stm32/51单片机/arduino等驱动代码)
- 华为OD机试 -旋转骰子(Python) | 机试题+算法思路+考点+代码解析 【2023】
- 华为OD机试 - 关联子串(Python) | 机试题+算法思路+考点+代码解析 【2023】
- VSCode 利用 Snippets 设置代码块[附带网站推荐]
- Web 之 JavaScript 一些常用的方法或者开发技巧整理(代码整理)
- python:一行代码实现局域网共享文件
- Google Code Pretiffy 代码 着色 高亮 开源 javascript(JS)库