ExtJs基础代码自己做

最新推荐文章于 2021-03-13 04:17:44 发布

mlhq123

最新推荐文章于 2021-03-13 04:17:44 发布

阅读量501

点赞数

分类专栏： ExtJS

本文链接：https://blog.csdn.net/mlhq123/article/details/38032543

版权

ExtJS 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

function(){
Ext.MessageBox.alert("hello","hello,my frist Extjs!!!");
}

Ext.onReady(function(){
var win = new Ext.Window({title:"hello",width:300,height:300,html:'<h1>hillo,i study extjs frist!!!</h1>'});
win.show();

});

new Ext.Button({renderTo:"hello", text:"添加", pressed:true, heigth:30, handler:Ext.emptyFn });

var win = new Ext.Window({title:"li",width:200,height:300,html:'hi'});
win.show();

Ext.onReady(
function(){
var obj= new Ext.Panel({title:"hello",width:300,height:200,html:'hello,i love study'});
obj.render("hello");
<div id="hello"> </div>
});

new Ext.Panel({
renderTo:"hello",
title:"李红琼的信息",
width:300,
layout:"form",
hideLabels:false,
labelAlign:"right",
height:120,
defaultType:'textfield',
items:[
{fieldLabel:"请输入姓名",name:"name"},
{fieldLabel:"请输入地址",name:"address"},
{fieldLabel:"请输入电话",name:"tel"}
]
});

new Ext.Panel({
renderTo:"hello",
title:"李红琼独立开发",
layout:"column",
width:500,
height:100,
items:[{title:"李红琼名",width:100},
{title:"love",width:100},
{title:"yang",width:100},
{title:"no"}
]
});

var panel=new Ext.Panel({
renderTo:"hello",
title:"li",
width:500,
height:200,
layout:"table",
layoutConfig: {

columns:3
},
items:[{title:"1",html:"konw",rowspan:2,height:100},
{title:"2",html:"konw2",colspan:2},
{title:"3",html:"konw3"},
{title:"4",html:"konw4"}

]
}
);

renderTo:"hello",
title:"组建",
width:500,
height:200,
layout:"table",
layoutConfig: {
columns:3
},
items:[{title:"元素一",html:"内容",rowspan:2,height:100},
{title:"元素二",html:"内容",colspan:2},
{title:"元素三",html:"3"},
{title:"go",html:"id"}
]
}
);

new Ext.Panel({
renderTo:"hello",
title:"hello",
width:400,
height:200,
html:'还好现在的我',
tools:[{
id:"save"
},
{id:"help",handler:function(){Ext.Msg.alert('help','i love myself');}},
{id:"close"}
],
tbar:[{pressed:true,text:'刷新'}]
});

new Ext.Panel({
renderTo:"hello",
title:"hello",
width:300,
height:200,
html:'i love me',
tbar:[new Ext.Toolbar.TextItem('工具栏'),
{xtype:"tbfill"},
{pressed:true,text:'添加'},
{xtype:"tbseparator"},
{pressed:true,text:'保存'}
]
});

var grid=new Ext.grid.GridPanel({
renderTo:"hello",
title:"中国开发团队",
height:200,
width:600,
cm:colM,
store:store,
autoExpandColumn:2
});
});

this.grid.on("afteredit",this.afterEdit,this);

afterEdit:function(obj){
var r = obj.record;
var id = r.get("id");
var name=r.get("name");
var c=this.record2obj(r);
var tree=this.tree;
var node=tree.getSelectionModel().getSelectedNade();
if(node && node.id!="root")c.parentId=node.id;
if(id=="-1" && name!=""){
topicCategoryService.addTopicCategory(c,function(id){
if(id)r.set("id",id);
if(!node)node=tree.root;
node.appendChild(new Ext.tree.TreeNode({
id:id,
text:c.name,
leaf:ture
}));
node.getUI().removeClass('x-tree-node-leaf');
node.getUI().addClass('x-tree-node-expanded');
node.expand();

});
}
else if(name!=""){
topicCategoryService.updateTopicCategory(r.get("id"),c,function(ret){
if(ret)tree.getNodeById(r.get("id")).setText(c.name);
});
}
}

new Ext.Viewport({ layout:"border", items:[ {
region:"north",
title:"面板",
html:"面板内容",
  height:100},
   { region:"center",
    xtype:"grid",
     title:"学生信息管理",

        store:store,
         autoExpandColumn:3 } ]});

var data=[[1,'web','easy','www.lhq.com'],
[2,'web','easy','www.lhq.com'],
[3,'web','easy','www.lhq.com'],
[4,'web','easy','www.lhq.com'],
[5,'web','easy','www.lhq.com']
];
var store =new Ext.data.SimpleStore({data:data,fields:["id","name","organization","homepage"]});
var colM=new Ext.grid.ColumnModel([{
header:"项目名称",dataIndex:"name",sortable:true
},
{header:"项目tuandui",dataIndex:"organization",sortable:true},
{header:"网址",dataIndex:"homepage"}]

);
var grid =new Ext.grid.GridPanel({
renderTo:"hello",
title:"中国",
height:200,
width:600,
cm:colM,
store:store,
autoExpandColumn:2
});

new Ext.Panel({
renderTo:"hello",
width:500,
height:400,
layout:"column",
items:[{
columnWidth:.5,
title:"111"},
{columnWidth:.5,
title:"222"}]
});

new Ext.Panel({
renderTo:"hello",
title:"li",
width:300,
height:200,

items:[{title:"李红琼名",width:40},
{title:"love",width:40},
{title:"yang",width:40},
{title:"no"}
],
tbar:[{text:'顶部'}],
bbar:[{text:'底部'}],
buttons:[{text:'footer'}]
});

new Ext.Panel({
renderTo:"hello",
title:"li",
width:300,
height:200,
html:'主面板',
tbar:[{text:'顶部'}],
bbar:[{text:'底部'}],
buttons:[{text:'footer'}]
});
var st= new Ext.Panel({title:"hillo",width:100,height:200,html:'hi'});
st.render("hello");
var panel = new Ext.TabPanel({width:300,height:200,items:[new Ext.Panel({title:"面板1",height:30}),new Ext.Panel({title:"面板二"，height:30}),new Ext.Panel({title:"面板三"，height:30})]});
panel.render("hello");
var panel = new Ext.TabPanel({width:300,height:200,items:[new Ext.Panel({title:"面板1",height:30}),new Ext.Panel({title:"面板二"，height:30})]});
panel.render("hello");
var n=new Ext.TabPanel({width:200,height:200,items:[new Ext.Panel({title:"hi",width:100,html:'no'}),new Ext.Panel({title:"no",width:100,html:'no'})]});
n.render("hello");
var b=new Ext.Button({
text:"添加"，
pressed:true,
height:30,
handler:Ext.emptyFn
});

var panel=new Ext.Viewport({
layout:"border",
items:[{
region:"north",
title:"面板",
html:"面板内容",
height:100
},
{region:"center",
xtype:"grid",
title:"学生信息管理",
store:store,
cm:colM,
store:store,
autoExpandColumn:3

}
]
});
panel.show();

Ext.onReady(function(){
New Ext.Panel({renderTo:"hello",title:"hello",width:300,height:200,html:'my frist lover yangsheng'});
<div id="hello"> </div>
});

mlhq123

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ExtJs基础代码自己做

function(){ Ext.MessageBox.alert("hello","hello,my frist Extjs!!!"); } Ext.onReady(function(){ var win = new Ext.Window({title:"hello",width:300,height:300,html:'hillo,i study extjs f
复制链接

扫一扫

专栏目录