结合工作内容,不定期更新。这里面可能会讲到一些常用的组件的操作。

json: {
"total": 30,
"data": [{
"funcAlign": "C",
"docNo": "ap5200_p",
"descMsg": "账龄分析",
"passWord": "",
"allowModify": "N",
"pageAlign": "C",
"titleFontSize": 20,
"funcFontSize": 8,
"titleHeight": 40,
"allowPrint": "N",
"tableName": "ap_rs_age_analysis",
"allowCopy": "N",
"modelFlag": "1",
"prtServer": "",
"sqlStatament": "",
"authNeeded": "N",
"pageNeeded": "Y",
"isMix": "N",
"pwNeeded": "N",
"pageSize": "KUANHANG",
"companyName": "",
"isRotate": "N",
"companyCode": "01",
"footer": "",
"maxLine": 10000,
"presentFontSize": 8,
"xmlPath": "",
"headFontSize": 8,
"headAlign": "C"
}

1.gridPanel

这个最常用,就是表格嘛,从后台接到收据的store里面读出数据,比如我传递了一个json,里面是对象的各个属性,那么我在前台显示的话,就要这样。

其中有一个可以自己调整部分字体颜色,比如如果是Y就显示对号,是N就显示X号,截图如下:

这个是关键点:

renderer : function(value){

    return value=='Y'?'<b style="color:red">√ </span>':'<span style="color:green">否</span>'

}

this.gridPanel = new Ext.grid.GridPanel({
autoScroll : true,
region : 'center',
store : this.store,
sm : sm,
cm : new Ext.grid.ColumnModel([sm,
new Ext.grid.RowNumberer({
header : '序号',
width : 35
}), {
xtype : 'actioncolumn',
header : '操作',
align : 'center',
width : 60,
items : [{
iconCls : 'report-pdf-edit',
tooltip : '修改',
handler : this.doEdit,
scope : this
}, {
iconCls : 'report-pdf-edit',
tooltip : '明细',
handler : this.openPdfHead,
scope : this
}] }, {
dataIndex : 'docNo',
sortable : true,
header : '文档名称',
width : 120,
align : 'left'
}, {
dataIndex : 'descMsg',
sortable : true,
header : '抬头信息',
width : 120,
align : 'left'
}, {
header : '对应表名',
dataIndex : 'tableName',
width : 120,
align : 'left'
}, {
header : '最大行数',
dataIndex : 'maxLine',
width : 120,
align : 'right'
}, {
header : '题头字号',
dataIndex : 'titleFontSize',
width : 120,
align : 'right'
}, {
header : '表头字号',
dataIndex : 'headFontSize',
width : 120,
align : 'right'
}, {
header : '数据字号',
dataIndex : 'presentFontSize',
width : 120,
align : 'right'
}, {
header : '题头高度',
dataIndex : 'titleHeight',
width : 120,
align : 'right'
}, {
header : '纸张类型',
dataIndex : 'pageSize',
width : 120,
align : 'center'
}, {
header : '横向打印',
dataIndex : 'isRotate',
width : 120,
align : 'center',
renderer : function(value){
return value=='Y'?'<b style="color:red">√ </span>':'<span style="color:green">否</span>'
}
}, {
header : '隔行变色',
dataIndex : 'isMix',
width : 120,
align : 'center',
renderer : function(value){
return value=='Y'?'√ ':'X'
}
}, {
header : 'sql语句',
dataIndex : 'sqlStatament',
width : 120,
align : 'left'
}])
});

2. 单选框 new Ext.form.RadioGroup

这个取值拿值是根据json里传来的值去自动判断的,所以前台只需要定义好你的Y值落在哪个单选框上即可。

3.数字文本框 NumberField

this.headWidth = new Ext.form.NumberField({
id : 'width',
name :'width',
fieldLabel : '宽度',
allowDecimals : false,//是否允许有小数点输入
minValue : 1,//最小值
width : 120
});

4.下拉框 Ext.form.ComboBox

this.align = new Ext.form.ComboBox({
id : 'align',
name : 'align',
fieldLabel : '对齐方式',//
width : 120,
displayField : 'alignName',
valueField : 'align',
mode : 'local',
triggerAction : 'all',
value : 'C',
store : new Ext.data.ArrayStore({
fields : ['align', 'alignName'],
data : [['L', 'L-居左'], ['C', 'C-居中'],
['R', 'R-居右']]
})
});

ExtJs3常用控件操作实例的更多相关文章

  1. C语言Windows程序开发—Windows窗口样式与常用控件样式【第04天】

    (一)Windows窗口(MDICLIENT)样式介绍 /* Windows窗口样式 */ WS_BORDER //带有边框的窗口 WS_CAPTION //带有标题栏的窗口 WS_CHILD //子 ...

  2. [WinForm]WinForm跨线程UI操作常用控件类大全

    前言 在C#开发的WinForm窗体程序开发的时候,经常会使用多线程处理一些比较耗时之类的操作.不过会有一个问题:就是涉及到跨线程操作UI元素. 相信才开始接触的人一定会遇上这个问题. 为了解决这个问 ...

  3. MFC编程入门之二十二(常用控件:按钮控件Button、Radio Button和Check Box)

    本节继续讲解常用控件--按钮控件的使用. 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check Box)等.命令按钮就是我们前面多次提到的侠义的 ...

  4. MFC之常用控件(四)

    常用控件主要包括:静态文本框.编辑框.单选按钮.复选框.分组框.列表框.组合框.图片控件.列表控件.树形控件和进度条控件等等.本节教程先来讲解静态文本框的使用. 控件的通知消息 在将静态文本框的使用之 ...

  5. Android support library支持包常用控件介绍(二)

    谷歌官方推出Material Design 设计理念已经有段时间了,为支持更方便的实现 Material Design设计效果,官方给出了Android support design library ...

  6. C# 常用控件属性及方法介绍

      C#常用控件属性及方法介绍                                               目录 1.窗体(Form) 2.Label (标签)控件 3.TextBox ...

  7. DevExpress XtraScheduler日程管理控件应用实例(2)-- 深入理解数据存储

    DevExpress年终击穿底价,单套授权低至67折!查看详情>>> 在上篇随笔<DevExpress XtraScheduler日程管理控件应用实例(1)-- 基本使用> ...

  8. VS2010/MFC编程入门之二十二(常用控件:按钮控件Button、Radio Button和Check Box)

    言归正传,鸡啄米上一节中讲了编辑框的用法,本节继续讲解常用控件--按钮控件的使用. 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check Box ...

  9. Day3 UI:7种常用控件、4种基本布局

    Android常用控件 TextView <TextView android:id="@+id/text_view" android:layout_width="m ...

随机推荐

  1. 【课程分享】Oracle数据库系统project师

    对这个课程有兴趣的朋友能够加我的QQ2059055336和我联系 一.本课程是怎么样的一门课程 1.1.课程的背景 该课程是Oracle数据库系统project师培训课程 Oracle Databas ...

  2. qt中使用opencv处理图片 QImage 和 IplImage 相互之间转换问题

    在用opencv处理图片显示在qt label上的时候遇到不是问题 1. qt上要用qimage形式才干显示 IplImage转成 Qimage 彩色图像转换 IplImage  *fram; QIm ...

  3. 如何更改应用在app store的名称

    如何修改应用在app store 的名称,我修改了plist里面的bundle display name,现在安装后在设备上会显示修改后的名称,可是app store里面还是原来的名称. 何把app ...

  4. C#学习第一天

    主要看了一些关于C#的发展期情况,对这门语言有了初步的了解,下面慢慢道来. 首先是C#语言的特点,相比较其他的语言,C#具有以下突出的特点: 1.语法简洁,不允许直接操作内存,去掉了指针操作: 2.彻 ...

  5. Java_Activiti5_菜鸟也来学Activiti5工作流_之JUnit单元测试(四)

    /**ActivitiSpringJuinitTest.java * author : 冯孟活 ^_^ * dates : 2015年9月2日 下午2:16:54 * class : activiti ...

  6. 函数返回一个SqlDataReader对象

    解决方法: 1.尝试使用dataset 2.执行数据库操作命令 SqlDataReader reader=mySqlCommand.ExecuteReader(CommandBehavior.Clos ...

  7. 设置ORACLE环境变量

    sqlplus 执行不了可能原因是未设置环境变量,设置方法:  export ORACLE_HOME=/usr/local/instantclient_11_2

  8. iOS sizeWithFont 过期 is deprecated

    原文: http://www.cnblogs.com/A--G/p/4819189.html iOS 2.0之后 sizeWithFont就被弃用了: //计算textview 高度 - (float ...

  9. JavaScript - 测试 jQuery

    测试 JavaScript 框架库 - jQuery 引用 jQuery 如需测试 JavaScript 库,您需要在网页中引用它. 为了引用某个库,请使用 <script> 标签,其 s ...

  10. Vijos1825 NOI2008 志愿者招募 费用流

    Orz ByVoid大神的题解:https://www.byvoid.com/blog/noi-2008-employee/ 学习网络流建图的好题,不难想到线性规划的模型,不过利用模型的特殊性,结合网 ...