快速开发平台WebBuilder中ExtJS表格的增删改查
使用WebBuilder可实现表格的自动增删改查功能,而无需编写前台脚本和后台SQL。
WebBuilder开源项目地址:http://www.putdb.com
自动生成的页面:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv=
"content-type"
content=
"text/html;charset=utf-8"
>
<title>Putdb WebBuilder</title>
<script type=
"text/javascript"
src=
"webbuilder/script/locale/wb-lang-zh_CN.js"
></script>
<script type=
"text/javascript"
src=
"webbuilder/script/welcome.js"
></script>
<link rel=
"stylesheet"
href=
"webbuilder/controls/ext/resources/css/ext-all.css"
type=
"text/css"
>
<link rel=
"stylesheet"
href=
"webbuilder/css/style.css"
type=
"text/css"
>
<script type=
"text/javascript"
src=
"webbuilder/controls/ext/ext-all.js"
></script>
<script type=
"text/javascript"
src=
"webbuilder/controls/ext/locale/ext-lang-zh_CN.js"
></script>
<script type=
"text/javascript"
src=
"webbuilder/script/wb.js"
></script>
<script type=
"text/javascript"
src=
"webbuilder/script/portal.js"
></script>
</head>
<body>
<script language=
"javascript"
type=
"text/javascript"
>
Ext.onReady(function(){
Wb.initialize(
null
,
480
);
Pt.indexPath=
"\n\n13LRIOHKYMUT\nide"
;
Wd.desktopData=
null
;
Pt.initialize();
Wd.moduleStore=
new
Ext.data.TreeStore({
sorters:{property:
'ORDER_INDEX'
},proxy:{type:
"ajax"
,url:
"main?xwl=13LTWX2EDCP6"
,listeners:{exception:function(proxy,response,operation,options){
Wb.except(response.responseText);
}}},fields:[{name:
'text'
},{name:
'iconCls'
},{name:
'MODULE_ID'
},{name:
'PARENT_ID'
},{name:
'ORDER_INDEX'
},{name:
'IS_FOLDER'
},{name:
'NEW_WIN'
}],params:{},listeners:{beforeload:function(store,operation,options){
Wb.setStore(store);
operation.params.parentId=operation.node.get(
'MODULE_ID'
);
},load:function(store,node,records,successful,options){
if
(successful){
if
(!Wd.pathInited){
Wd.pathInited=
true
;
if
(Pt.indexPath.length<
2
)Wb.selFirst(moduleTree);
else
moduleTree.selectPath(Pt.indexPath,
'MODULE_ID'
,
'\n'
);
}
}
}}
});
Wd.saveDesktop={request:function(p){Wb.request(saveDesktop,p)},url:
"main?xwl=13NPCFVS59ZT"
,params:{},beforerequest:function(ajax){
ajax.params.data=Pt.getDesktop();
}};
Wd.moduleTool=
new
Ext.toolbar.Toolbar({
id:
"moduleTool"
,items:[
{id:
"blankBtn"
,xtype:
"tbspacer"
}
,{id:
"titleLabel"
,text:
"Putdb WebBuilder 6.5"
,xtype:
"label"
,style:
"text-shadow:0 -1px 1px #FFFFFF;"
}
,{id:
"blankSt"
,width:
10
,xtype:
"tbspacer"
}
,{id:
"userBtn"
,iconCls:
"user_icon"
,text:
"Administrator"
,listeners:{click:function(item,event,options){
Wb.open(
'main?xwl=account'
,Str.myAccount,
'user_icon'
);
}}
}
,{id:
"regBtn"
,tooltip:Str.productRegister,hidden:
false
,text:
"<font color='#FF0000'>注册<\/font>"
,listeners:{click:function(item,event,options){
Wb.open(
'main?xwl=register'
,Str.productRegister,
'key_icon'
);
}}
}
,{id:
"spaceBtn"
,xtype:
"tbfill"
}
,{id:
"backBtn"
,iconCls:
"prior_icon"
,tooltip:Str.back,xtype:
"splitbutton"
,listeners:{arrowclick:function(item,event,options){
Wb.showNavMenu(backBtn,forwardBtn,
true
);
},click:function(item,event,options){
Wb.navBack(backBtn,forwardBtn);
}}
}
,{id:
"forwardBtn"
,iconCls:
"next_icon"
,tooltip:Str.forward,xtype:
"splitbutton"
,listeners:{arrowclick:function(item,event,options){
Wb.showNavMenu(forwardBtn,backBtn,
false
);
},click:function(item,event,options){
Wb.navFwd(backBtn,forwardBtn);
}}
}
,{id:
"closeBtn"
,iconCls:
"close_icon"
,tooltip:Str.closeAll,xtype:
"splitbutton"
,listeners:{click:function(item,event,options){
Pt.close(
true
);
}},menu:{xtype:
"menu"
,items:[
{id:
"closeOthersItem"
,text:Str.closeOthers,listeners:{click:function(item,event,options){
Pt.close(
false
);
}}
}
]}}
,{id:
"toggleBtn"
,iconCls:
"align_icon"
,tooltip:Str.toggleAppList,listeners:{click:function(item,event,options){
moduleTree.setVisible(!moduleTree.isVisible());
}}
}
,{id:
"homeBtn"
,iconCls:
"home_icon"
,tooltip:Str.homePage,listeners:{click:function(item,event,options){
moduleTab.setActiveTab(homePage);
}}
}
,{id:
"saveBtn"
,iconCls:
"save_icon"
,tooltip:Str.saveDesktop,listeners:{click:function(item,event,options){
saveDesktop.request();
}}
}
,{id:
"divItem2"
,xtype:
"tbseparator"
}
,{id:
"refreshPageBtn"
,iconCls:
"refresh_icon"
,tooltip:Str.refreshPage,listeners:{click:function(item,event,options){
Pt.refresh();
}}
}
,{id:
"refreshModuleBtn"
,iconCls:
"ajax_icon"
,tooltip:Str.refreshModule,listeners:{click:function(item,event,options){
Wb.refresh(moduleTree,
'MODULE_ID'
);
}}
}
,{id:
"divItem3"
,xtype:
"tbseparator"
}
,{id:
"logoutBtn"
,iconCls:
"logout_icon"
,tooltip:Str.logout,listeners:{click:function(item,event,options){
Pt.logout();
}}
}
]});
Wd.viewport=
new
Ext.container.Viewport({
id:
"viewport"
,layout:
"fit"
,items:[
{id:
"mainPanel"
,tbar:moduleTool,layout:
"border"
,xtype:
"panel"
,items:[
{rootVisible:
false
,id:
"moduleTree"
,region:
"west"
,animate:
false
,store:moduleStore,width:
220
,split:
true
,viewConfig:Pt.viewConfig(),xtype:
"treepanel"
,listeners:{itemclick:function(view,record,item,index,event,options){
Pt.run(record);
},itemmousedown:function(view,record,item,index,event,options){
Wb.setDDText(view,record.get(
'text'
));
}}
}
,{id:
"moduleTab"
,region:
"center"
,deferredRender:
false
,xtype:
"tabpanel"
,plugins:{ptype:
"tabscrollermenu"
},listeners:{afterrender:function(tab,options){
tab.mon(tab.tabBar,
'dblclick'
,Pt.monDbClick,tab);
},tabchange:function(tab,newCard,oldCard,options){
Pt.moduleTabChange(tab,newCard,oldCard,options);
Wb.recNav(newCard,oldCard,backBtn);
}},items:[
{id:
"homePage"
,title:Str.homePage,autoScroll:
true
,layout:
"absolute"
,hideMode:
"offsets"
,iconCls:
"home_icon"
,xtype:
"panel"
,listeners:{afterrender:function(panel,options){
Pt.ddSupport(panel);
}}
}
]}
]}
]});
Pt.finalize();
});
</script>
</body>
</html>
http://www.tianya.cn/89427433