var obj={title:"hello",width:1024,height:768,html:'hello'}
var panel=new Ext.Panel(obj)
panel.render("hello")
panel.render()函数里面的参数是指页面中div的id。
TabPanel面板控件元素的用法：
var panel=new Ext.TabPanel({width:600,height:400,items:[{title:'面板1',height:30,html:'No1'},{title:'面板2',height:30,html:'No2'},{title:'面板3',height:30,html:'No3'}]})
panel.render('hello')
其中html:’’指面板中的内容
6.对控件添加事件监听响应函数：
Ext.onReady(function (){
var win=new Ext.Window({
title:'不能关闭的窗口',
height:200,
width:300
})
win.on("beforedestroy",
function(obj){
alert('想关闭我是不可能的')
obj.show()
return false
}
)
win.show()
}
)
当然，也可以在对控件进行配置的时候添加事件监听函数：
function b(){
alert("hcn")
}
Ext.onReady(function (){
new Ext.Panel({
renderTo:'hello',
title:'面板头部header',
width:1000,
height:500,
tools:[{id:'help',handler:a}],
html:'<h3>面板主区域</h3>',
tbar:[{text:'顶端工具栏1',listeners:{"click":b}},{text:'顶端工具栏2',listeners:{"click":b}}],
bbar:[{text:'底端工具栏1',listeners:{"click":b}},{text:'底端工具栏2',listeners:{"click":b}}],
buttons:[{text:'按钮位于foot',listeners:{"click":b}}]
}
)
}
)
运行效果：
点击任何一个按钮都会d出如下界面：
7.布局layout
Extjs的容器组件包含一个layout和layoutConfig属性，这两个属性用来设置容器的布局和布局的详细配置信息。
Border区域布局：
east\west\south\north\center
Column列布局：
Fit布局：
Form布局：
Accordion布局：
点击+/-可以使用动画，属性layoutConfig{animate：true}即可设置动画属性。
Table布局：
rowspan colspan
1、首先，需要先创建一个基本可用的 ExtJS 模板， 这个很简单， 如下所示：<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="http://localhost/ext-4/resources/css/ext-all.css" />
<script type="text/javascript" src="http://localhost/ext-4/ext-debug.js"></script>
</head>
<body>
</body>
</html>
2、需要引用的脚本是 ExtJS 根目录下的 ext-debug.js ， 不是 ext-all-debug.js， 这个文件非常小， 只有几百K ， 当让这个只是最基本的 ExtJS 组件， 不包括任何的界面功能。
3、配置 Ext.Loader 启用动态加载；
4、ExtJS 中的动态加载是由 Ext.Loader 来完成的， 默认不启用动态加载， 所以接下来需要做的事配置 Ext.Loader 启用动态加载， 在上面模板的 body 标签内添加如下代码：
<script type="text/javascript">
Ext.onReady(function() {
Ext.Loader.setConfig({
enabled: true,
disableCaching: false,
paths: {
Ext : '/ext-4/src'
}
})
})
</script>
注意：上面的代码启用了动态加载， 禁用了浏览器缓存， 以及指定了 ExtJS 的所部署的路径。
提供一种思路，每次查询后台返回一条数据，前台new 一个model,手工插入store中。假设后台返回的数据为jsonObj,则
var r = Ext.create('mymodel',{no:jsonObj.no,name:jsonObj.name...})
mystore.insert(0,r)
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）