ExtJS 3 在Tab下加入Form 实例
发布日期:2021-10-01 03:31:25 浏览次数:14 分类:技术文章

本文共 2529 字,大约阅读时间需要 8 分钟。

相关导入的js 和 css文件需齐备, 这个无须多说了

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Tabs</title> <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" /> <link rel="stylesheet" type="text/css" href="../resources/css/xtheme-blue.css" /> <script type="text/javascript" src="../adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../ext-all.js"></script> <script> Ext.onReady(function(){ var fs = new Ext.FormPanel({ frame: true, title:'Migrate File to DataBase', labelAlign: 'right', labelWidth: 90, height:240, waitMsgTarget: true, items: [ new Ext.form.FieldSet({ title: 'Select', autoHeight: true, defaultType: 'textfield', items: [ new Ext.form.TextField({ fieldLabel: 'Project Name', name:'ProjectName', id:'ProjectName', selectOnFocus:true, width:120 }), new Ext.form.Checkbox({ fieldLabel: 'Migrate ALL', id:'migrateAll', name:'migrateAll' }), new Ext.form.TextField({ fieldLabel: 'Begin Page', id:'mtBegin', name:'mtBegin', selectOnFocus:true, width:30 }), new Ext.form.TextField({ fieldLabel: 'End Page', id:'mtEnd', name:'mtEnd', selectOnFocus:true, width:30 }) ] }) ], buttons: [{ text: 'Migrate', handler: function(){ alert("Begin Migrate"); //can submit form as : /* fs.getForm().submit({ url: 'mt_get_migrate_export_count', waitMsg: 'Migrate...', timeout: 50000, success: function(fs, o){ } }); */ } },{ text: 'DownLoad Log', handler:DownLoadLog },{ text: 'Clear Log', handler: ClearLog } ] }); function DownLoadLog() { } function ClearLog() { } var fs2 = new Ext.FormPanel({ frame: true, title:'Migrate2', labelAlign: 'right', labelWidth: 90, height:240, waitMsgTarget: true, items: [ new Ext.form.FieldSet({ title: 'Select', autoHeight: true, defaultType: 'textfield', items: [ new Ext.form.TextField({ fieldLabel: 'Project Name', name:'ProjectName', id:'ProjectName', selectOnFocus:true, width:120 }), new Ext.form.Checkbox({ fieldLabel: 'Migrate ALL', id:'migrateAll', name:'migrateAll' }) ] }) ], buttons: [{ text: 'Migrate', handler: function(){ alert("Begin Migrate"); //can submit form as : /* fs.getForm().submit({ url: 'mt_get_migrate_export_count', waitMsg: 'Migrate...', timeout: 50000, success: function(fs, o){ } }); */ } } ] }); var tabs = new Ext.TabPanel({ renderTo: 'tabDiv', width:450, activeTab: 0, frame:true, defaults:{autoHeight: true}, items:[fs,fs2 ] }); }); </script> </head> <body> <div id="tabDiv"></div> <br> </body> </html>

转载地址:https://blog.csdn.net/iteye_1789/article/details/82130041 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:java POI 读取并打印Excel程序片段
下一篇:Ext3 -- Form 实例。 用来migrate file 数据到DB用的

发表评论

最新留言

初次前来,多多关照!
[***.217.46.12]2024年04月08日 03时00分15秒