ExtJs学习笔记

最新推荐文章于 2023-06-17 22:40:09 发布

llwan

最新推荐文章于 2023-06-17 22:40:09 发布

阅读量679

点赞数

分类专栏： ExtJs 文章标签： extjs

本文链接：https://blog.csdn.net/llwan/article/details/49153267

版权

ExtJs 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

1、表格

属性：forceFit，默认为false，设置为true时，如果表格的列数过多，不会出现滚动条

2、布局

hbox：横向排列，使用flex属性设置各元素所占宽度，如果有三个元素，每个设置flex为1，则三个元素平均分布

vbox：竖向排列

3、使面板底部的按钮居中显示

buttonAlign: 'center',//居中
buttons: [{text:'确定'}]//按钮

4、定义样式

两种写法：

bodyStyle : {
	background : 'none',
	padding : '10px',
        textAlign:'center'//这里注意没有短横线
 }
//或者这样写
//bodyStyle:'background:none;padding:10px;text-align:center'

5、隐藏grid中的一列

{
	dataIndex : 'id',
	text : 'ID',
	hidden: true,
	hideable: false
}

6、刷新控件

Ext.getCmp('gridid').getView().refresh();

7、重新绑定store

Ext.getCmp('gridid').reconfigure(newStore);

8、store的load()和reload()

load( Object options ) : Boolean
采用配置好的Reader格式去加载Record缓存，具体请求的任务由配置好的Proxy对象完成。

reload( Object options )
依据上一次的load操作的参数的Reader制订的格式，再一次向Proxy对象要求施以加载（Reload）Record缓存的操作。

load重新提交新的参数请求数据
reload提交用上一次的参数请求数据

刷新要用load，否则会将上次参数再次请求

9、tooltip不显示

tooltip : String
A tooltip message to be displayed on hover. Ext.tip.QuickTipManager must have been initialized.

Ext.tip.QuickTipManager需要实例化：

Ext.onReady(function() {
	Ext.tip.QuickTipManager.init();
	// init();
});

10、下载文件

没有特殊的设置，下载的动作为：window.location.href='能够返回文件地址的地址';

11、区分Ext.getCmp()和Ext.getDom()两个方法
Ext.getCmp()是根据Ext的实例ID来获取Ext的对象，比如自定义的panel等。
Ext.getDom()是根据document对象的ID来获取document对象，比如页面中某个div块或某个iframe。

12、grid添加checkbox列

//定义grid

{
        xtype : 'grid',
        width : 150,
        height : 120,
        itemId : 'roleGrid',
        store : roleStore,
        hideHeaders : true,
        columns : [ {
            xtype : 'checkcolumn',
            dataIndex : 'checked',
            width : 60
        }, {
            dataIndex : 'roleName',
            flex : 1
        } ]

    }

//获取选中的数据

var roleArray = '';
    Ext.each(roleStore.data.items, function(item) {
        // console.log(item.raw.checked);
        if (item.raw.checked) {
            roleArray += item.raw.roleCode + ',';
        }

    });

13、EXT 中 json对象数组和字符串转换

function testJsonString() {

    var str = "[{value:1,text:'a'},{value:2,text:'b'}]";
    var list = "[{value:1,text:'a'},{value:2,text:'b'}]";
    alert(str);
    alert(list);
    // Ext.decode把字符串转换为对象数组
    list = Ext.decode(str);
    alert('list[0]:' + list[0].value + ',' + list[0].text);

    // Ext.encode把对象数组转换为字符串
    str = Ext.encode(list);
    alert('string is :' + str);
}