var gridForm = Ext.create('Ext.form.Panel', {
id: 'company-form',
frame: true,
title: 'Company data',
bodyPadding: 5,
width: '100%',
layout: 'column', // Specifies that the items will now be arranged in columns
fieldDefaults: {
labelAlign: 'left',
msgTarget: 'side'
},
items: [{
columnWidth: 0.60,
xtype: 'gridpanel',
//store: ds,
height: 600,
forceFit: true, //列表宽度自适应
title:'客户信息表',
columns: [{
text: 'id',
dataIndex: 'id',
hidden: true
},{
text: '认筹编号',
dataIndex: 'company'
},
{
text : '姓名',
dataIndex: 'price'
},
{
text : '电话号码',
dataIndex: 'change'
},
{
text : '证件号',
dataIndex: 'pctChange'
},
{
text : '签到状态',
dataIndex: 'lastChange'
}]
}, {
columnWidth: 0.4,
margin: '0 0 0 10',
xtype: 'fieldset',
title:'Company details',
defaults: {
width: 240,
labelWidth: 90
},
defaultType: 'textfield',
items: [{
fieldLabel: 'Name',
name: 'company'
},{
fieldLabel: 'Price',
name: 'price'
},{
fieldLabel: '% Change',
name: 'pctChange'
},{
xtype: 'datefield',
fieldLabel: 'Last Updated',
name: 'lastChange'
}, {
xtype: 'radiogroup',
fieldLabel: 'Rating',
columns: 3,
defaults: {
name: 'rating' //Each radio has the same name so the browser will make sure only one is checked at once
},
items: [{
inputValue: '0',
boxLabel: 'A'
}, {
inputValue: '1',
boxLabel: 'B'
}, {
inputValue: '2',
boxLabel: 'C'
}]
}]
}]
});
/**
* 左部
*
*/
var product_left = Ext.create('Ext.panel.Panel', {
region: 'west',
width: 300,
collapsible: true,
split: true
});
var product_center = Ext.create('Ext.panel.Panel', {
region: 'center',
width: '100%',
items: [gridForm]
});
/**
* EXT渲染
*
*/
Ext.onReady(function () {
Ext.create('Ext.container.Viewport', {
layout: 'border',
items: [product_left, product_center],
renderTo: 'proFrame'
});
});
分享到:
相关推荐
EXTJS4 GRID 表格 分页 编辑 添加判断 颜色判断 分组 等示例
这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹,其余文件过大并且与主题无关,因此未包含。具体方法,请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》
基于Extjs4官方的例子,做了一个关于MVC和Grid增删改的小例子
Extjs4 grid 导出为Excel 下载后放在网站(不放在网站中导出按钮不能会点击无响应,因为这里调用了swf文件)里可直接运行index.html测试 <link href='...
extjs4 grid 包括form js代码
Extjs动态Grid的生成 htm
ExtJS grid过滤操作,可以动态操作本地的store更改筛选的内容
Extjs 中想改变grid 行高,如果只是简单的设置了height的值是可以实现grid 的行高,但是如果使用了插件:rowexpander ,最出现新的问题。 感兴趣的朋友可以试试的。 此文档可以解决你的烦恼,为了找到资源下载,...
Extjs4下拉菜单中用Grid显示,有单选,和多选两个控件,完美通用代码控件,绝对让你好用,值得收藏^-^
ExtJs 4.0 Grid 单元格合并控件封装
使用ExtJs相关的控件类自己实现的一个ExtJs的Grid列表的导出功能,可以导出列表的相关样式等
Extjs4 Grid分页与自动刷新
extjs4打印grid插件,官网上的一个例子程序,有需要的人可以下载来看看。
extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台extjs动态生成表格,前台+后台
NULL 博文链接:https://yghjoe.iteye.com/blog/1541280
extjs4Grid和jqGrid对比.doc
extjs grid示例代码extjs grid示例代码extjs grid示例代码extjs grid示例代码
功能: 中文排序功能 具体: 实现按照中文信息,进行排序 用法: 将此方法,放到ext-all.js文件最后,或者放到html页面最上面,总之要在Ext初始化之后,实际代码调用之前执行。
extjs树型表格组件的使用示例,详细说明可以参见http://blog.csdn.net/snail_spoor/article/details/39698037
Extjs4的textfield控件竟然没有tooltip悬浮提示,这应该算是个bug吧。网上查了很多,也没有方案。后来自己通过查询并整理出这个方案,终于实现了。 思想如下: 在textfield渲染时注册mouseover事件,然后在其中调用...